アセットを CSS にロードしようとしていますが、場合によっては (大きなファイル)、特定のディレクトリにコピーします。URL ローダーを使用し、名前テンプレートのクエリ パラメータを定義すると、次のエラーが発生します。
エラー: パス変数 [name] はこのコンテキストで実装されていません: [path][name].[ext]?7770f0c15c5bc5d8291a
出力が定義された複数のエントリ ポイントを使用していますが、それが問題かどうかはわかりません。コンテキストを強制する方法はありますか? 以下のWebpack構成。
module.exports = [{
debug: !isProduction,
devtool: isProduction ? false : 'source-map',
entry: {
// Globals:
'./public/dist/css/base' : './src/scss/base',
'./public/dist/css/module' : './src/scss/module',
},
output: {
path: __dirname,
filename: '[name].css',
},
module: {
loaders: [
{
test: /\.css$/,
loader: 'style-loader!css-loader'
}, {
test: /\.scss$/,
loader: ExtractTextPlugin.extract('style', ['css?sourceMap', 'postcss', 'sass?sourceMap'])
}, {
test: /.*\.(gif|png|jpe?g|svg)$/i,
loaders: [
'url?{limit: 2048, name: "[path][name].[ext]?[hash]"}'
],
include: path.join(__dirname, 'src/images')
}
]
},
resolve: {
extensions: ['', '.css', '.scss'],
root: [path.join(__dirname, './src')]
},
plugins: plugins,
resolveUrlLoader: {
root: './public/dist/images'
},
postcss: [
autoprefixer({
browsers: ['last 2 versions']
})
],
sassLoader: {
includePaths: [path.resolve(__dirname, './src/scss')],
outputStyle: isProduction ? 'compressed' : 'expanded'
},
}]
これは私のファイル構造です:
- src
|- sass
|- js
|- images
- public
|- css
|- js
|- images