This repository has been archived by the owner on Feb 9, 2018. It is now read-only.
forked from rdubigny/cozy-music
-
Notifications
You must be signed in to change notification settings - Fork 7
/
webpack.config.js
151 lines (143 loc) · 3.67 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
144
145
146
147
148
149
150
151
var path = require('path');
var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var CopyPlugin = require('copy-webpack-plugin');
var BrowserSyncPlugin = require('browser-sync-webpack-plugin');
// use the `OPTIMIZE` env VAR to switch from dev to production build
var optimize = process.env.OPTIMIZE === 'true';
/**
* Loaders used by webpack
*
* - CSS and images files from `vendor` are excluded
* - stylesheets are optimized via cssnano, minus svgo and autoprefixer that are
* customized via PostCSS
* - images are cache-busted in production build
*/
var cssOptions = optimize? 'css?-svgo&-autoprefixer&-mergeRules!postcss':'css';
var loaders = [
{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel', // 'babel-loader' is also a legal name to reference
query: {
presets: ['es2015']
}
},
{
test: /\.jst$/,
loader: 'underscore'
},
{
test: /\.json$/,
loader: 'json'
},
{
test: /\.styl$/,
loader: ExtractTextPlugin.extract('style', cssOptions + '!stylus')
},
{
test: /\.svg$/,
include: /icons/,
loader: 'svg-sprite'
}
];
/**
* Configure Webpack's plugins to tweaks outputs:
*
* all builds:
* - ExtractTextPlugin: output CSS to file instead of inlining it
*
* prod build:
* - AssetsPlugin: paths to cache-busted's assets to read them from server
* - DedupePlugin
* - OccurenceOrderPlugin
* - UglifyJsPlugin
* - DefinePlugin: disable webpack env dev vars
*
* dev build:
* - BrowserSyncPlugin: make hot reload via browsersync exposed at
* http://localhost:3000, proxified to the server app port
*/
var plugins = [
new ExtractTextPlugin(optimize? 'app.[hash].css' : 'app.css'),
new CopyPlugin([
{
from: 'vendor/fonts',
to: 'fonts'
},
{
from: 'vendor/app-icon.svg',
to: 'app-icon.svg'
}
]),
new HtmlWebpackPlugin({
template: './app/index.ejs',
inject: false,
minify: {
collapseWhitespace: true,
collapseBooleanAttributes: true
}
}),
new webpack.ProvidePlugin({
$: "jquery",
_: "underscore"
})
];
if (optimize) {
plugins = plugins.concat([
new webpack.optimize.DedupePlugin(),
new webpack.optimize.OccurenceOrderPlugin(),
new webpack.optimize.UglifyJsPlugin({
mangle: true,
compress: {
warnings: false
},
}),
new webpack.DefinePlugin({
__SERVER__: !optimize,
__DEVELOPMENT__: !optimize,
__DEVTOOLS__: !optimize
})
]);
} else {
plugins = plugins.concat([
new BrowserSyncPlugin({
proxy: 'http://localhost:' + (process.env.PORT || 9104) + '/',
open: false
})
]);
}
/**
* PostCSS Config
*
* - autoprefixer to add vendor prefixes for last 2 versions
* - mqpacker to bring together all MQ rule's set
*/
var postcss = [
require('autoprefixer')(['last 2 versions']),
require('css-mqpacker')
];
/**
* Webpack config
*
* - output to `public` dir
* - cache-bust assets when build for production
*/
module.exports = {
entry: './app/initialize',
output: {
path: 'public',
filename: optimize? 'app.[hash].js' : 'app.js',
},
resolve: {
extensions: ['', '.js', '.sass', '.jst', '.json']
},
debug: !optimize,
devtool: 'source-map',
module: {
loaders: loaders
},
plugins: plugins,
postcss: postcss
};