Webpack配置对我的SCSS文件不起作用:(
webpack config is not working for my scss files :(
我正在尝试使用css模块和sass加载器。然而,这似乎不起作用。这是我的webpack配置-它没有抛出任何错误,但当我检查/static/
时,我只看到bundle.js而不是style.scss。
var webpack = require('webpack');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var path = require('path');
module.exports = {
devtool: 'source-map',
entry: [
'webpack-hot-middleware/client',
'index.js'
],
output: {
path: path.join(__dirname, 'dist'),
filename: 'bundle.js',
publicPath: '/static/'
},
resolve: {
root: path.resolve(__dirname),
extensions: ['', '.js', '.jsx']
},
module: {
loaders: [
{
test: /'.jsx?$/,
loaders: [
'react-hot',
'babel'
],
include: path.join(__dirname, ''),
exclude: /node_modules/
},
{
test: /'.(png|jpg)$/,
loader: 'file-loader?name=img/[name].[ext]'
},
{
test: /'.scss$/,
loader: ExtractTextPlugin.extract('style-loader', ['css-loader', 'autoprefixer-loader', 'sass-loader'])
}
]
},
plugins: [
new webpack.optimize.OccurenceOrderPlugin(),
new webpack.HotModuleReplacementPlugin(),
new ExtractTextPlugin('/static/style.css', {
allChunks: true
})
]
};
您只需要添加文件名而不是文件路径(因为它是基于publicPath的)
...
module: {
loaders: [
{
test: /'.jsx?$/,
loaders: [
'react-hot',
'babel'
],
include: path.join(__dirname, ''),
exclude: /node_modules/
},
{
test: /'.(png|jpg)$/,
loader: 'file-loader?name=img/[name].[ext]'
},
{
test: /'.scss$/,
loader: ExtractTextPlugin.extract('style-loader', 'css-loader', 'autoprefixer-loader', 'sass-loader')
}
]
},
plugins: [
new webpack.optimize.OccurenceOrderPlugin(),
new webpack.HotModuleReplacementPlugin(),
new ExtractTextPlugin('style.css', {
allChunks: true
})
]
};
相关文章:
- 带有凭据的角度文件上载(CORS)不起作用
- html文件中的script标记根本不起作用
- grunt上的压缩文件夹不起作用
- 当我在浏览器中打开HTML文件时,javascript不起作用
- AJAX上传文件不起作用
- 在Hapi.js中提供静态JavaScript文件不起作用
- ngResource没有'从JSON文件解析HTML时不起作用
- jQueryAjax调用在单独的.js文件中不起作用
- PhoneGap读写文件获胜'不起作用
- 我尝试使用我的本地js文件来获取远程IP数据,但它不起作用
- 某些js文件在Drupal中不起作用
- 使用gulp-angular gettext从JS文件中提取字符串不起作用
- google.setOnLoadCallback()在单独的JS文件中不起作用
- css&js文件在php中不起作用
- 从HTML链接时,Javascript文件不起作用
- 如果在include文件中使用连接,Jquery ajax调用将不起作用
- php文件中包含的jquery文件在服务器上不起作用
- Cufon-builder-font-js文件在Fabric.js中不起作用
- 如果.htaccess文件中只写了一行代码,那么我所有的css和js都不起作用,如何修复它
- Haskell调用Node.js文件不起作用