Skip to content

Commit 084303a

Browse files
Awk34Awk34
committed
chore(webpack): upgrade to 2.2.0-rc.2
1 parent 5e999b2 commit 084303a

File tree

3 files changed

+113
-125
lines changed

3 files changed

+113
-125
lines changed

‎templates/app/_package.json‎

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -103,6 +103,7 @@
103103
"babel-plugin-transform-flow-comments": "^6.8.0",<% } %>
104104
"babel-plugin-transform-class-properties": "^6.6.0",
105105
"babel-plugin-transform-runtime": "^6.6.0",
106+
"babel-plugin-istanbul": "^3.1.0",
106107
"babel-preset-es2015": "^6.6.0",
107108
"eslint": "^2.12.0",
108109
"del": "^2.0.2",
@@ -137,11 +138,11 @@
137138
"run-sequence": "^1.1.0",
138139
"lazypipe": "^1.0.1",
139140
<%# WEBPACK %>
140-
"webpack": "^1.12.14",
141-
"webpack-dev-middleware": "^1.5.1",
142-
"webpack-stream": "^3.2.0",
143-
"extract-text-webpack-plugin": "^1.0.1",
144-
"html-webpack-plugin": "^2.16.0",
141+
"webpack": "2.2.0-rc.2",
142+
"webpack-dev-middleware": "^1.9.0",
143+
"webpack-dev-server": "^2.2.0-rc.0",
144+
"extract-text-webpack-plugin": "2.0.0-beta.4",
145+
"html-webpack-plugin": "^2.24.1",
145146
"html-webpack-harddisk-plugin": "~0.0.2",
146147
<%_ if(filters.pug) { _%>
147148
"pug-html-loader": "^1.0.8",<% } %>
@@ -167,7 +168,7 @@
167168
<%_ if(filters.stylus) { _%>
168169
"stylus": "^0.54.5",
169170
"stylus-loader": "^2.1.1",<% } %>
170-
"karma-webpack": "^1.7.0",
171+
"karma-webpack": "^1.8.1",
171172
<%# END WEBPACK %>
172173
"through2": "^2.0.1",
173174
"open": "~0.0.4",

‎templates/app/gulpfile.babel.js‎

Lines changed: 19 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ import {Server as KarmaServer} from 'karma';
1616
import runSequence from 'run-sequence';
1717
import {protractor, webdriver_update} from 'gulp-protractor';
1818
import {Instrumenter} from 'isparta';
19-
import webpack from 'webpack-stream';
19+
import webpack from 'webpack';
2020
import makeWebpackConfig from './webpack.make';
2121

2222
var plugins = gulpLoadPlugins();
@@ -223,37 +223,26 @@ gulp.task('inject:<%= styleExt %>', () => {
223223
.pipe(gulp.dest(`${clientPath}/app`));
224224
});
225225

226-
gulp.task('webpack:dev', function() {
227-
const webpackDevConfig = makeWebpackConfig({ DEV: true });
228-
return gulp.src(webpackDevConfig.entry.app)
229-
.pipe(plugins.plumber())
230-
.pipe(webpack(webpackDevConfig))
231-
.pipe(gulp.dest('.tmp'));
232-
});
226+
function webpackCompile(options, cb) {
227+
let compiler = webpack(makeWebpackConfig(options));
233228

234-
gulp.task('webpack:dist', function() {
235-
const webpackDistConfig = makeWebpackConfig({ BUILD: true });
236-
return gulp.src(webpackDistConfig.entry.app)
237-
.pipe(webpack(webpackDistConfig))
238-
.on('error', (err) => {
239-
this.emit('end'); // Recover from errors
240-
})
241-
.pipe(gulp.dest(`${paths.dist}/client`));
242-
});
229+
compiler.run((err, stats) => {
230+
if(err) return cb(err);
243231

244-
gulp.task('webpack:test', function() {
245-
const webpackTestConfig = makeWebpackConfig({ TEST: true });
246-
return gulp.src(webpackTestConfig.entry.app)
247-
.pipe(webpack(webpackTestConfig))
248-
.pipe(gulp.dest('.tmp'));
249-
});
232+
plugins.util.log(stats.toString({
233+
colors: true,
234+
timings: true,
235+
chunks: options.BUILD
236+
}));
237+
cb();
238+
});
239+
}
250240

251-
gulp.task('webpack:e2e', function() {
252-
const webpackE2eConfig = makeWebpackConfig({ E2E: true });
253-
return gulp.src(webpackE2eConfig.entry.app)
254-
.pipe(webpack(webpackE2eConfig))
255-
.pipe(gulp.dest('.tmp'));
256-
});<% if(filters.ts) { %>
241+
gulp.task('webpack:dev', cb => webpackCompile({ DEV: true }, cb));
242+
gulp.task('webpack:dist', cb => webpackCompile({ BUILD: true }, cb));
243+
gulp.task('webpack:test', cb => webpackCompile({ TEST: true }, cb));
244+
gulp.task('webpack:e2e', cb => webpackCompile({ E2E: true }, cb));
245+
<%_ if(filters.ts) { -%>
257246

258247
// Install DefinitelyTyped TypeScript definition files
259248
gulp.task('typings', () => {
@@ -282,7 +271,7 @@ gulp.task('lint:scripts', cb => runSequence(['lint:scripts:client', 'lint:script
282271
gulp.task('lint:scripts:client', () => {
283272
return gulp.src(_.union(
284273
paths.client.scripts,
285-
_.map(paths.client.test, blob => '!' + blob)
274+
_.map(paths.client.test, blob => `!${blob}`)
286275
))
287276
.pipe(lintClientScripts());
288277
});

‎templates/app/webpack.make.js‎

Lines changed: 87 additions & 89 deletions
Original file line numberDiff line numberDiff line change
@@ -77,7 +77,7 @@ module.exports = function makeWebpackConfig(options) {
7777
<%_ if(filters.ts) { _%>
7878
config.resolve = {
7979
modulesDirectories: ['node_modules'],
80-
extensions: ['', '.js', '.ts']
80+
extensions: ['.js', '.ts']
8181
};<% } %>
8282

8383
if(TEST) {
@@ -108,54 +108,41 @@ module.exports = function makeWebpackConfig(options) {
108108
* List: http://webpack.github.io/docs/list-of-loaders.html
109109
* This handles most of the magic responsible for converting modules
110110
*/
111-
<%_ if(filters.sass) { _%>
112-
113-
config.sassLoader = {
114-
outputStyle: 'compressed',
115-
precision: 10,
116-
sourceComments: false
117-
};<% } %>
118-
119-
<%_ if(filters.babel) { -%>
120-
config.babel = {
121-
shouldPrintComment(commentContents) {
122-
<%_ if(filters.flow) { -%>
123-
let regex = DEV
124-
// keep `// @flow`, `/*@ngInject*/`, & flow type comments in dev
125-
? /(@flow|@ngInject|^:)/
126-
// keep `/*@ngInject*/`
127-
: /@ngInject/;
128-
return regex.test(commentContents);
129-
<%_ } -%>
130-
<%_ if(!filters.flow) { -%>
131-
// keep `/*@ngInject*/`
132-
return /@ngInject/.test(commentContents);
133-
<%_ } -%>
134-
}
135-
}<% } %>
136111

137112
// Initialize module
138113
config.module = {
139-
preLoaders: [],
140-
loaders: [{
114+
noParse: [
115+
path.join(__dirname, 'node_modules', 'zone.js', 'dist'),
116+
path.join(__dirname, 'node_modules', '@angular', 'bundles'),
117+
],
118+
rules: [{
141119
// JS LOADER
142120
// Reference: https://github.com/babel/babel-loader
143121
// Transpile .js files using babel-loader
144122
// Compiles ES6 and ES7 into ES5 code
145123
test: /\.js$/,
146-
loader: 'babel',
124+
use: {
125+
loader: 'babel',
126+
options: {
127+
plugins: TEST ? ['istanbul'] : [],
128+
}
129+
},
147130
include: [
148131
path.resolve(__dirname, 'client/'),
149-
path.resolve(__dirname, 'node_modules/lodash-es/')
132+
path.resolve(__dirname, 'server/config/environment/shared.js'),
133+
path.resolve(__dirname, 'node_modules/lodash-es/'),
150134
]
151135
}, {
152136
// TS LOADER
153137
// Reference: https://github.com/s-panferov/awesome-typescript-loader
154138
// Transpile .ts files using awesome-typescript-loader
155139
test: /\.ts$/,
156-
loader: 'awesome-typescript-loader',
157-
query: {
158-
tsconfig: path.resolve(__dirname, 'tsconfig.client.json')
140+
use: {
141+
loader: 'awesome-typescript-loader',
142+
<%_ if(filters.ts) { -%>
143+
options: {
144+
tsconfig: path.resolve(__dirname, 'tsconfig.client.json')
145+
},<% } %>
159146
},
160147
include: [
161148
path.resolve(__dirname, 'client/')
@@ -168,21 +155,21 @@ module.exports = function makeWebpackConfig(options) {
168155
// Pass along the updated reference to your code
169156
// You can add here any file extension you want to get copied to your output
170157
test: /\.(png|jpg|jpeg|gif|svg|woff|woff2|ttf|eot)([\?]?.*)$/,
171-
loader: 'file'
158+
use: 'file'
172159
}, {
173160
<%_ if(filters.pug) { _%>
174161
// Pug HTML LOADER
175162
// Reference: https://github.com/willyelm/pug-html-loader
176163
// Allow loading Pug throw js
177164
test: /\.(jade|pug)$/,
178-
loaders: ['pug-html']
165+
use: 'pug-html'
179166
}, {<% } %>
180167
<%_ if(filters.html) { _%>
181168
// HTML LOADER
182169
// Reference: https://github.com/webpack/raw-loader
183170
// Allow loading html through js
184171
test: /\.html$/,
185-
loader: 'raw'
172+
use: 'raw'
186173
}, {<% } %>
187174
// CSS LOADER
188175
// Reference: https://github.com/webpack/css-loader
@@ -191,7 +178,7 @@ module.exports = function makeWebpackConfig(options) {
191178
// Reference: https://github.com/postcss/postcss-loader
192179
// Postprocess your css with PostCSS plugins
193180
test: /\.css$/,
194-
loader: !TEST
181+
use: !TEST
195182
// Reference: https://github.com/webpack/extract-text-webpack-plugin
196183
// Extract css files in production builds
197184
//
@@ -206,7 +193,7 @@ module.exports = function makeWebpackConfig(options) {
206193
// SASS LOADER
207194
// Reference: https://github.com/jtangelder/sass-loader
208195
test: /\.(scss|sass)$/,
209-
loaders: ['raw', 'sass'],
196+
use: ['raw', 'sass'],
210197
include: [
211198
path.resolve(__dirname, 'node_modules/bootstrap-sass/assets/stylesheets/*.scss'),
212199
path.resolve(__dirname, 'client')
@@ -215,7 +202,7 @@ module.exports = function makeWebpackConfig(options) {
215202
// LESS LOADER
216203
// Reference: https://github.com/
217204
test: /\.less$/,
218-
loaders: ['style', 'css', 'less'],
205+
use: ['style', 'css', 'less'],
219206
include: [
220207
path.resolve(__dirname, 'node_modules/bootstrap/less/*.less'),
221208
path.resolve(__dirname, 'client/app/app.less')
@@ -224,46 +211,17 @@ module.exports = function makeWebpackConfig(options) {
224211
// Stylus LOADER
225212
// Reference: https://github.com/
226213
test: /\.styl$/,
227-
loaders: ['style', 'css', 'stylus'],
214+
use: ['style', 'css', 'stylus'],
228215
include: [
229216
path.resolve(__dirname, 'node_modules/bootstrap-styl/bootstrap/*.styl'),
230217
path.resolve(__dirname, 'client/app/app.styl')
231218
]<% } %>
232219
}<% } %>]
233220
};
234221

235-
<%_ if(filters.babel) { _%>
236-
// ISPARTA INSTRUMENTER LOADER
237-
// Reference: https://github.com/ColCh/isparta-instrumenter-loader
238-
// Instrument JS files with Isparta for subsequent code coverage reporting
239-
// Skips node_modules and spec files
240-
if(TEST) {
241-
config.module.preLoaders.push({
242-
//delays coverage til after tests are run, fixing transpiled source coverage error
243-
test: /\.js$/,
244-
exclude: /(node_modules|spec\.js|mock\.js)/,
245-
loader: 'isparta-instrumenter',
246-
query: {
247-
babel: {
248-
// optional: ['runtime', 'es7.classProperties', 'es7.decorators']
249-
}
250-
}
251-
});
252-
}<% } %>
253-
<%_ if(filters.ts) { _%>
222+
<%_ if(filters.ts) { -%>
254223
//TODO: TS Instrumenter<% } %>
255224

256-
/**
257-
* PostCSS
258-
* Reference: https://github.com/postcss/autoprefixer-core
259-
* Add vendor prefixes to your css
260-
*/
261-
config.postcss = [
262-
autoprefixer({
263-
browsers: ['last 2 version']
264-
})
265-
];
266-
267225
/**
268226
* Plugins
269227
* Reference: http://webpack.github.io/docs/configuration.html#plugins
@@ -283,7 +241,43 @@ module.exports = function makeWebpackConfig(options) {
283241
// Disabled when in test mode or not in build mode
284242
new ExtractTextPlugin('[name].[hash].css', {
285243
disable: !BUILD || TEST
286-
})
244+
}),
245+
246+
new webpack.LoaderOptionsPlugin({
247+
options: {
248+
context: __dirname
249+
},
250+
/**
251+
* PostCSS
252+
* Reference: https://github.com/postcss/autoprefixer-core
253+
* Add vendor prefixes to your css
254+
*/
255+
postcss: [
256+
autoprefixer({
257+
browsers: ['last 2 version']
258+
})
259+
],
260+
<%_ if(filters.sass) { -%>
261+
sassLoader: {
262+
outputStyle: 'compressed',
263+
precision: 10,
264+
sourceComments: false
265+
},<% } %>
266+
<%_ if(filters.babel) { -%>
267+
babel: {
268+
<%_ if(filters.flow) { -%>
269+
shouldPrintComment(commentContents) {
270+
let regex = DEV
271+
// keep `// @flow` & flow type comments in dev
272+
? /(@flow|^:)/
273+
// strip comments
274+
: false;
275+
return regex.test(commentContents);
276+
},<% } %>
277+
<%_ if(!filters.flow) { -%>
278+
comments: false<% } %>
279+
},<% } %>
280+
}),
287281
];
288282

289283
if(!TEST) {
@@ -334,27 +328,31 @@ module.exports = function makeWebpackConfig(options) {
334328
warnings: false
335329
}
336330
}),
337-
338-
// Reference: https://webpack.github.io/docs/list-of-plugins.html#defineplugin
339-
// Define free global variables
340-
new webpack.DefinePlugin({
341-
'process.env': {
342-
NODE_ENV: '"production"'
343-
}
344-
})
345331
);
346332
}
347333

334+
let localEnv;
335+
try {
336+
localEnv = require('./server/config/local.env').default;
337+
} catch(e) {
338+
localEnv = {};
339+
}
340+
localEnv = _.mapValues(localEnv, value => `"${value}"`);
341+
localEnv = _.mapKeys(localEnv, (value, key) => `process.env.${key}`);
342+
343+
let env = _.merge({
344+
'process.env.NODE_ENV': DEV ? '"development"'
345+
: BUILD ? '"production"'
346+
: TEST ? '"test"'
347+
: '"development"'
348+
}, localEnv);
349+
350+
// Reference: https://webpack.github.io/docs/list-of-plugins.html#defineplugin
351+
// Define free global variables
352+
config.plugins.push(new webpack.DefinePlugin(env));
353+
348354
if(DEV) {
349355
config.plugins.push(
350-
// Reference: https://webpack.github.io/docs/list-of-plugins.html#defineplugin
351-
// Define free global variables
352-
new webpack.DefinePlugin({
353-
'process.env': {
354-
NODE_ENV: '"development"'
355-
}
356-
}),
357-
358356
new webpack.HotModuleReplacementPlugin()
359357
);
360358
}
@@ -385,9 +383,9 @@ module.exports = function makeWebpackConfig(options) {
385383
};
386384

387385
config.node = {
388-
global: 'window',
386+
global: true,
389387
process: true,
390-
crypto: 'empty',
388+
crypto: false,
391389
clearImmediate: false,
392390
setImmediate: false
393391
};

0 commit comments

Comments
 (0)