-
Notifications
You must be signed in to change notification settings - Fork 4
/
webpack.config.js
102 lines (100 loc) · 3.07 KB
/
webpack.config.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
var path = require('path')
var webpack = require('webpack')
module.exports = {
// 入口文件
entry: {
main: './src/main.js'
},
output: {
// 打包后输出的目录
path: path.resolve(__dirname, './dist'),
// 打包后资源文件的前缀
publicPath: 'dist/',
filename: '[name].js'
},
plugins: [
new webpack.ProvidePlugin({
$: "jquery",
jQuery: "jquery",
"window.jQuery": "jquery",
_: "underscore",
V: "vendor/vectorizer"
})
],
resolve: {
// require时省略的扩展名,如:require('module') 不需要module.js
extensions: ['', '.js', '.vue'],
// 别名
alias: {
vue: 'vue/dist/vue.js', //webpack打包时,需要设置别名
components: path.join(__dirname, './src/components'),
modules: path.join(__dirname, './node_modules'),
store: path.resolve('src/store/'),
vendor: path.resolve('src/vendor/')
}
},
// 处理不同后缀的文件
module: {
loaders: [
{
test: /\.js(x)*$/,
exclude: /^node_modules$/,
loader: 'babel'
},
{
test: /\.vue$/,
loader: 'vue'
},
{
test: /\.css/,
loader: `style-loader!css-loader!autoprefixer-loader?{ browsers: ['last 100 versions'] }!`
},
{
test: /\.less/,
exclude: /^node_modules$/,
loader: `style-loader!css-loader!autoprefixer-loader?{ browsers: ['last 100 versions'] }!less-loader`
},
{
test: /\.(png|jpg)$/,
loader: 'url?limit=2000&name=[name].[ext]' //注意后面那个limit的参数,当你图片大小小于这个限制的时候,会自动启用base64编码图片
},
{
test: /\.(eot|woff|svg|ttf|woff2|gif|appcache)(\?|$)/,
loader: 'file-loader?name=[name].[ext]'
}
]
},
// webpack-dev-server配置
devServer: {
historyApiFallback: true,
noInfo: true
},
vue: {
postcss: [
require('autoprefixer')({
browsers: ['last 100 versions']
})
]
},
// 开启source-map,webpack有多种source-map,在官网文档可以查到
devtool: '#source-map'
}
// 生产环境,运行npm run build则执行这里
if (process.env.NODE_ENV === 'production') {
module.exports.devtool = '#source-map'
// http://vue-loader.vuejs.org/en/workflow/production.html
module.exports.plugins = (module.exports.plugins || []).concat([
// 环境变量
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: '"production"'
}
}),
// 压缩代码
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
}
})
])
}