fix(webpack): copy environment file on build

closes #714

Author: JeroenVinke

lib/commands/new/buildsystems/webpack/index.js

@@ -36,7 +36,8 @@ module.exports = function(project, options) {
     ProjectItem.resource('build.ext', 'tasks/build-webpack.ext', project.model.transpiler),
     ProjectItem.resource('build.json', 'tasks/build.json'),
     ProjectItem.resource('run.ext', 'tasks/run-webpack.ext', project.model.transpiler),
-    ProjectItem.resource('run.json', 'tasks/run-webpack.json')
+    ProjectItem.resource('run.json', 'tasks/run-webpack.json'),
+    ProjectItem.resource('environment.ext', 'tasks/environment.ext', project.model.transpiler),
   ).addToContent(
     ProjectItem.resource('index.ejs', 'content/index-webpack.ejs'),
     ProjectItem.resource('package-scripts.js', 'content/package-scripts.template.js')
@@ -45,6 +46,7 @@ module.exports = function(project, options) {
     ProjectItem.resource('webpack.config.js', 'content/webpack.config.template.js')
       .asTemplate(model)
   ).addToDevDependencies(
+    'gulp-rename',
     'html-webpack-plugin',
     'copy-webpack-plugin',
     'extract-text-webpack-plugin',

lib/resources/tasks/build-webpack.js

@@ -2,6 +2,8 @@ import webpackConfig from '../../webpack.config';
 import webpack from 'webpack';
 import project from '../aurelia.json';
 import {CLIOptions, Configuration} from 'aurelia-cli';
+import gulp from 'gulp';
+import configureEnvironment from './environment';
 
 const buildOptions = new Configuration(project.build.options);
 const production = CLIOptions.getEnvironment() === 'prod';
@@ -14,7 +16,7 @@ const config = webpackConfig({
 });
 const compiler = webpack(config);
 
-function build(done) {
+function buildWebpack(done) {
   compiler.run(onBuild);
   compiler.plugin('done', () => done());
 }
@@ -29,7 +31,13 @@ function onBuild(err, stats) {
   }
 }
 
+const build = gulp.series(
+  configureEnvironment,
+  buildWebpack
+);
+
 export {
   config,
+  buildWebpack,
   build as default
 };

lib/resources/tasks/build-webpack.ts

@@ -2,6 +2,8 @@ import * as webpackConfig from '../../webpack.config';
 import * as webpack from 'webpack';
 import * as project from '../aurelia.json';
 import {CLIOptions, Configuration} from 'aurelia-cli';
+import * as gulp from 'gulp';
+import configureEnvironment from './environment';
 
 const buildOptions = new Configuration(project.build.options);
 const production = CLIOptions.getEnvironment() === 'prod';
@@ -14,7 +16,7 @@ const config = webpackConfig({
 });
 const compiler = webpack(config);
 
-function build(done) {
+function buildWebpack(done) {
   compiler.run(onBuild);
   compiler.plugin('done', () => done());
 }
@@ -29,7 +31,13 @@ function onBuild(err, stats) {
   }
 }
 
+const build = gulp.series(
+  configureEnvironment,
+  buildWebpack
+);
+
 export {
   config,
+  buildWebpack,
   build as default
 };

lib/resources/tasks/environment.js

@@ -0,0 +1,24 @@
+import project from '../aurelia.json';
+import rename from 'gulp-rename';
+import {CLIOptions} from 'aurelia-cli';
+import gulp from 'gulp';
+import fs from 'fs';
+import path from 'path';
+import through from 'through2';
+
+function configureEnvironment() {
+  let env = CLIOptions.getEnvironment();
+
+  return gulp.src(`aurelia_project/environments/${env}${project.transpiler.fileExtension}`)
+    .pipe(rename(`environment${project.transpiler.fileExtension}`))
+    .pipe(gulp.dest(project.paths.root))
+    .pipe(through.obj(function (file, enc,  cb) {
+      // https://github.com/webpack/watchpack/issues/25#issuecomment-287789288
+      var now = Date.now() / 1000;
+      var then = now - 10;
+      fs.utimes(file.path, then, then, function (err) { if (err) throw err });
+      cb(null, file);
+    }));
+}
+
+export default configureEnvironment;

lib/resources/tasks/environment.ts

@@ -0,0 +1,24 @@
+import * as project from '../aurelia.json';
+import * as rename from 'gulp-rename';
+import {CLIOptions} from 'aurelia-cli';
+import * as gulp from 'gulp';
+import * as fs from 'fs';
+import path from 'path';
+import * as through from 'through2';
+
+function configureEnvironment() {
+  let env = CLIOptions.getEnvironment();
+
+  return gulp.src(`aurelia_project/environments/${env}${project.transpiler.fileExtension}`)
+    .pipe(rename(`environment${project.transpiler.fileExtension}`))
+    .pipe(gulp.dest(project.paths.root))
+    .pipe(through.obj(function (file, enc,  cb) {
+      // https://github.com/webpack/watchpack/issues/25#issuecomment-287789288
+      var now = Date.now() / 1000;
+      var then = now - 10;
+      fs.utimes(file.path, then, then, function (err) { if (err) throw err });
+      cb(null, file);
+    }));
+}
+
+export default configureEnvironment;

lib/resources/tasks/run-webpack.js

@@ -1,11 +1,13 @@
 import {config} from './build';
+import configureEnvironment from './environment';
 import webpack from 'webpack';
 import Server from 'webpack-dev-server';
 import project from '../aurelia.json';
 import {CLIOptions, reportWebpackReadiness} from 'aurelia-cli';
-import build from './build';
+import gulp from 'gulp';
+import {buildWebpack} from './build';
 
-function run(done) {
+function runWebpack(done) {
   // https://webpack.github.io/docs/webpack-dev-server.html
   let opts = {
     host: 'localhost',
@@ -37,7 +39,7 @@ function run(done) {
     if (err) throw err;
 
     if (opts.lazy) {
-      build(() => {
+      buildWebpack(() => {
         reportWebpackReadiness(opts);
         done();
       });
@@ -48,4 +50,9 @@ function run(done) {
   });
 }
 
+const run = gulp.series(
+  configureEnvironment,
+  runWebpack
+);
+
 export { run as default };

lib/resources/tasks/run-webpack.ts

@@ -1,11 +1,13 @@
 import {config} from './build';
+import configureEnvironment from './environment';
 import * as webpack from 'webpack';
 import * as Server from 'webpack-dev-server';
 import * as project from '../aurelia.json';
 import {CLIOptions, reportWebpackReadiness} from 'aurelia-cli';
-import build from './build';
+import * as gulp from 'gulp';
+import {buildWebpack} from './build';
 
-function run(done) {
+function runWebpack(done) {
   // https://webpack.github.io/docs/webpack-dev-server.html
   let opts = {
     host: 'localhost',
@@ -37,7 +39,7 @@ function run(done) {
     if (err) throw err;
 
     if (opts.lazy) {
-      build(() => {
+      buildWebpack(() => {
         reportWebpackReadiness(opts);
         done();
       });
@@ -48,4 +50,9 @@ function run(done) {
   });
 }
 
+const run = gulp.series(
+  configureEnvironment,
+  runWebpack
+);
+
 export { run as default };