特定のフォルダを指定するにはWebpack sassを使用しますか？

Question

私はドキュメントをチェックして他の人の質問をチェックしてきましたが、私のすべての嫌がらせを単純なCSSファイルにコンパイルし、出力するCSSファイルを出力するディレクトリを指定する簡単な答えは見つかりません。 。

速いコンテキストの場合： 私はパブリックディレクトリにスタイルシートディレクトリとビルドディレクトリを持っています。 webpackはアプリケーションをビルドにコンパイルして、スタイルシートディレクトリにstyle.cssをコンパイルしたいと思います。

public dir img

私は私のwebpack.config.js（のみ簡潔にするために適切なコードを示す）でこのような何かを行うことができるようにしたいと思い

：

ここ

は私の公開ディレクトリのスクリーンショットですモジュール内

const ExtractTextPlugin = require('extract-text-webpack-plugin'); 

...

// To be called in plugins: 
const cssOutput = new ExtractTextPlugin('./public/stylesheets/style.css'); 

ローダー：プラグインで

{ 
    test: /\.scss$/, 
    loader: ExtractTextPlugin.extract('style-loader', 'css-loader!sass-loader'), 
    }, 

：

plugins: [ 
    . 
    . 
    . 
    cssOutput, 
    ], 

私は公共のディレクトリにある私のindex.htmlファイルで、この行を出力ファイルにアクセスできるようにしたいと思い

：

<link rel="stylesheet" href="/stylesheets/style.css" /> 

私は現在gulpを使用していますが、うまくいきます。すべてをwebpackに移行しようとしています。どんな助けでも大歓迎です！

Answer 1

はあなただけで、このような出力ファイルを設定することができ判明します。私は追加する必要がありましたwebpack.config.jsにおけるモジュールローダ内部ように、この問題に遭遇し、誰のために

は、私はまだ、フォントや画像に問題があった：

{ 
    test: /\.(eot|woff|woff2|ttf|svg|png|jpe?g|gif)(\?\S*)?$/, 
    loader: 'file', 
    }, 

と、この出力はすべて以降に私のビルドディレクトリは、パスのエラーを防ぐために、ビルドディレクトリのすべてを出力するようにCSSを変更しました。私はこれに変更しました：

const cssOutput = new ExtractTextPlugin('style.css', { allChunks: true }); 

これは、このタイプの問題に遭遇している他の人に役立つことを願っています。

Answer 2

https://www.npmjs.com/package/extract-text-webpack-pluginをご覧ください。 が必要になるでしょう。私index.jsxファイルに

require('_scss/style.scss'); 

：私は追加するには忘れのnoobのミスをした

const cssOutput = new ExtractTextPlugin('../stylesheets/style.css', { allChunks: true }); 

：