2つのエントリポイントを作成し、ExtractTextPluginを使用して私のcss(sassからコンパイル)とjsを分離しようとしていますが、何らかの理由で空のbundle.js(マニフェストのjsコードを除く)と正しいstyle.cssファイル。私はこれは私が私のwebpack.config.jsの構成方法に関係していると確信していますが、私はちょうど私がここで間違ってやっているかを把握することはできません...Webpackバンドル分割で空のbundle.jsが生成される
const path = require('path')
const webpack = require('webpack')
const ExtractTextPlugin = require('extract-text-webpack-plugin')
/**
* Default webpack configuration for development
*/
const config = {
devtool: 'source-map',
entry: {
app: path.resolve(__dirname, 'resources/js/app.js'),
style: path.resolve(__dirname, 'resources/sass/style.scss')
},
output: {
path: path.resolve(__dirname, 'public/scripts'),
filename: 'bundle.js'
},
module: {
loaders: [
{
test: /\.jsx?$/,
exclude: /node_modules/,
loader: 'babel',
query: {
presets: ['es2015', 'react']
}
},
{
test: /\.scss$/,
loader: ExtractTextPlugin.extract('style', 'css?minimize!resolve-url!sass?sourceMap'),
include: path.resolve(__dirname, 'resources/sass')
},
{
test: /\.(png|woff|woff2|eot|ttf|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
loader: 'url'
}
]
},
plugins: [
new ExtractTextPlugin('../css/[name].css'),
],
devServer: {
contentBase: './public',
colors: true,
historyApiFallback: true,
inline: true
}
}
/**
* If bundling for production, optimize output
*/
if (process.env.NODE_ENV === 'production') {
config.plugins.push(
new webpack.optimize.OccurenceOrderPlugin(),
new webpack.optimize.UglifyJsPlugin({comments: false}),
new webpack.DefinePlugin({
'process.env': {NODE_ENV: JSON.stringify('production')}
})
)
}
module.exports = config
とのWebPACKを実行しているの出力:
私は結果bundle.js CSS/SASSを行うには、すべてをコメントアウトすると正常に見えます。単純なCSSソースファイルでも試しましたが、これは同じ空の結果を与えます。おそらく私はCommonsChunkPluginを何とか使う必要がありますか?どんな助けでも大歓迎です。
最初に - これを取り除く 'style:path.resolve(__ dirname、 'resources/sass/style.scss')' second - '新しいExtractTextPlugin( '../ css/[name] .css'、{allChunks :true}) '、第3 - あなたのページに' link'タグを含めて、あなたのスタイルはここになければなりません。 –
残念ながら仕事はありません。はい、私のbundle.jsは今作成されましたが、style.cssは生成されていません。 –