2017-09-19 8 views
0

私はgithubページで反応を得ようとしていますが、CSSはまったく読み込まれていません。私のプロジェクトはscssを使用しています。これはsrc /の中の自分のディレクトリです。それらは成分によって分離され、各反応成分にインポートされる。私はdevサーバーを実行するとうまく動作しますが、githubページにデプロイしようとすると、読み込みに失敗したcss以外はすべて正常に動作します。 webpack.config.prodファイルに何かを追加する必要がありますか?ここで私の反応のgithubページの展開にCSSがロードされていません

は私のプロジェクト構造である:ここで

/rootDir 
    config 
    node_modules 
    public 
    images 
    index.html 
    manifest.json 
    scripts 
    src 
    js 
     components 
     ... 
     App.js 
    scss 
     ... 
     App.scss 
    index.js 
    registerServiceWorker 
    package.json 

は私webpack.config.devです:

{ 
    test: /\.css$/, 
    use: [ 
    require.resolve('style-loader'), 
    { 
     loader: require.resolve('css-loader'), 
     options: { 
     importLoaders: 1, 
     }, 
    }, 
    { 
     loader: require.resolve('postcss-loader'), 
     options: { 
     ident: 'postcss', 
     plugins:() => [ 
      require('postcss-flexbugs-fixes'), 
      autoprefixer({ 
      browsers: [ 
       '>1%', 
       'last 4 versions', 
       'Firefox ESR', 
       'not ie < 9', // React doesn't support IE8 anyway 
      ], 
      flexbox: 'no-2009', 
      }), 
     ], 
     }, 
    }, 
    ], 
}, 
//Adding SCSS 
{ 
    test: /\.scss$/, 
    use: [ 
    'style-loader', 
    'css-loader', 
    'sass-loader' 
    ] 
}, 
+0

プロダクションバージョンがローカルマシンで実行されていますか? –

+0

@Prakashsharma私はそう信じています。私は私のローカルマシンから "ヤーンランビルド"を実行します。 –

答えて

0

私はwebpack.config.prodファイルに以下のスニペットを追加することでこれを解決し

{ 
    test: /\.scss$/, 
    use: [ 
    'style-loader', 
    'css-loader', 
    'sass-loader' 
    ] 
}, 
関連する問題