webpack.config.js
var ExtractTextPlugin = require("extract-text-webpack-plugin"); var path = require("path"); var webpack = require('webpack'); module.exports = { entry: { app: './src/app.js', vendor: ['jquery'] }, output: { path: path.resolve(__dirname, "build"), filename: "[name].js?1.2.1" }, module: { loaders: [ { test: /\.scss$/, loader: ExtractTextPlugin.extract("style-loader", "css-loader!sass-loader") }, { test: /\.js$/, exclude: /node_modules/, loader: 'babel', query: { presets: ['es2015'] } }, ] }, plugins: [ new ExtractTextPlugin("[name].css?1.2.1"), new webpack.optimize.CommonsChunkPlugin('vendor','vendor.js',{ allChunks: true }), new webpack.ProvidePlugin({ $: 'jquery' }), ] }
HTML:
DEMO
目录:
你在那个页面js文件中引入了scss?
类似如下:
js文件中引入css
import 'appcss'; import Vue from 'vue';
基本配置和你一样, 我的可以提取出css
你的app.js或者content.js中要有如下代码才会打包出来
import './style.scss';//ES6 require './style/scss';//ES5
没有这些代码的话,webpack不知道你在哪里引入了scss,当然也就谈不上打包出来了。