-
Notifications
You must be signed in to change notification settings - Fork 0
/
webpack.config.js
143 lines (138 loc) · 3.58 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
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
var path = require('path');
var webpack = require('webpack');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
// This is the webpack configuration for the whole application,
// pulling in resources from the various perform bundles as well as
// your own code.
// You are welcome to modify this configuration to suit your needs.
// https://useperform.com/docs/base-bundle/ui/assets.html
// asset-paths.js is generated every time the cache is cleared.
// Use this to get entrypoints and asset namespaces (resolve.alias).
var assetPaths = require('./asset-paths.js');
// babel options need to be passed to both the babel-loader and vue-loader.
// vue-loader v15 will remove this requirement, and will handle
// javascript like any other .js$ file.
var babelOptions = {
presets: [
// explicitly resolve babel presets to prevent it
// looking for them in entrypoint directories
[require.resolve('babel-preset-env'), {
"targets": {
"browsers": ['last 2 versions', '> 1%'],
"uglify": true
},
"modules": false
}],
],
babelrc: false,
};
module.exports = {
entry: assetPaths.entrypoints,
output: {
path: path.resolve(__dirname, 'public/'),
filename: '[name].js'
},
module: {
rules: [
{
test: /\.vue$/,
loader: 'vue-loader',
options: {
loaders: {
js: {
loader: 'babel-loader',
options: babelOptions,
}
}
}
},
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
options: babelOptions,
}
},
{
test: /\.scss$/,
use: ExtractTextPlugin.extract({
use: [
'css-loader',
{
loader: 'sass-loader',
options: {
// sass loader options
// compact output is often useful for scanning the output for errors
outputStyle: 'compact',
}
}
]
})
},
{
test: /(!webfont)\.(png|jpg|gif|svg)$/,
loader: 'file-loader',
options: {
name: '[name].[ext]?[hash]'
}
},
{
test: /webfont\.(ttf|otf|eot|svg|woff(2)?)(\?[a-z0-9]+)?$/,
use: [{
loader: 'file-loader',
options: {
name: '[name].[ext]',
outputPath: 'fonts/',
}
}]
},
]
},
resolve: {
// tell webpack to look for npm deps in this directory, not in the
// entrypoint directories
modules: [
path.resolve(__dirname, 'node_modules')
],
alias: Object.assign({
'vue$': 'vue/dist/vue.esm.js',
}, assetPaths.namespaces),
extensions: ['*', '.js', '.vue', '.json']
},
resolveLoader: {
// also tell webpack to look for loaders in this directory
modules: [
path.resolve(__dirname, 'node_modules')
],
},
performance: {
hints: false
},
devtool: '#eval-source-map',
plugins: [
new ExtractTextPlugin({
filename: "[name].css",
})
]
}
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({
sourceMap: true,
compress: {
warnings: false
}
}),
new webpack.LoaderOptionsPlugin({
minimize: true
})
]);
}