chore(build): upgrade to latest webpack

mko-mx · Dec 4, 2016 · 4eadf64 · 4eadf64
1 parent 8f2870a
commit 4eadf64
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 21 deletions.
diff --git a/package.json b/package.json
@@ -82,7 +82,7 @@
     "typescript": "2.0.3",
     "url-loader": "^0.5.7",
     "validate-commit-msg": "^2.8.2",
-    "webpack": "^2.1.0-beta.25",
+    "webpack": "^2.1.0-beta.27",
     "webpack-dev-server": "^2.1.0-beta.9",
     "webpack-merge": "^0.14.1",
     "webpack-validator": "^2.2.9"

diff --git a/scripts/webpack/appParts.js b/scripts/webpack/appParts.js
@@ -15,6 +15,8 @@ function createAppParts(rootDir, env = {}) {
     };
 
     const isDevServer = process.argv.find(v => v.indexOf('webpack-dev-server') !== -1);
+    const loadCssWithSourceMaps = ['css-loader?sourceMap', 'resolve-url-loader', 'sass-loader?sourceMap'];
+    const loadCss = ['css-loader', 'resolve-url-loader', 'sass-loader?sourceMap'];
 
     return Object.assign({}, commonParts, {
         asAppBundle,
@@ -117,7 +119,7 @@ function createAppParts(rootDir, env = {}) {
                 rules: [
                     {
                         test: /\.(png|jpg|jpeg|gif|svg|woff|woff2|ttf|eot)$/,
-                        loader: `url?limit=${sizeLimit}&name=[path][name]-[hash].[ext]`
+                        loader: `url-loader?limit=${sizeLimit}&name=[path][name]-[hash].[ext]`
                     }
                 ]
             }
@@ -130,7 +132,7 @@ function createAppParts(rootDir, env = {}) {
                 rules: [
                     {
                         test: /\.html$/,
-                        loaders: ['ngtemplate?requireAngular&relativeTo=/src/&prefix=demo-app/', 'html'],
+                        loaders: ['ngtemplate-loader?requireAngular&relativeTo=/src/&prefix=demo-app/', 'html-loader'],
                         include: [
                             path.resolve(rootDir, 'src')
                         ],
@@ -147,7 +149,7 @@ function createAppParts(rootDir, env = {}) {
                 rules: [
                     {
                         test: /ng-table[\/\\]src[\/\\].*\.html$/,
-                        loaders: ['ngtemplate?requireAngular&relativeTo=/src/browser/&prefix=ng-table/', 'html']
+                        loaders: ['ngtemplate-loader?requireAngular&relativeTo=/src/browser/&prefix=ng-table/', 'html-loader']
                     }
                 ]
             }
@@ -169,22 +171,22 @@ function createAppParts(rootDir, env = {}) {
 
     function _extractSass(files) {
         const extractor = new ExtractTextPlugin('[name].[chunkhash].css');
-        let loader;
+        let loaders;
         if (env.debug || env.prod) {
             // note: we CAN use source maps for *extracted* css files in a deployed website without 
             // suffering from the problem of image urls not resolving to the correct path
-            loader = 'css?sourceMap!resolve-url!sass?sourceMap';
+            loaders = loadCssWithSourceMaps;
         } else {
-            loader = 'css!resolve-url!sass?sourceMap';
+            loaders = loadCss;
         }
         return {
             module: {
                 rules: [
                     {
                         test: /\.scss$/,
                         loader: extractor.extract({
-                            fallbackLoader: 'style',
-                            loader: loader
+                            fallbackLoader: 'style-loader',
+                            loader: loaders
                         }),
                         include: files
                     }
@@ -201,19 +203,19 @@ function createAppParts(rootDir, env = {}) {
         // note: would like to use sourcemaps in a deployed website (ie outside of dev-server)
         // but these do not work with relative paths (see the configuration of ouput options 
         // in this file for more details)
-        let loader;
+        let loaders;
         if ((env.debug || env.prod) && isDevServer) {
-            loader = 'style!css?sourceMap!resolve-url!sass?sourceMap';
+            loaders = ['style-loader', ...loadCssWithSourceMaps];
         } else {
             // note: the 
-            loader = 'style!css!resolve-url!sass?sourceMap';
+            loaders = ['style-loader', ...loadCss];
         }
         return {
             module: {
                 rules: [
                     {
                         test: /\.scss$/,
-                        loader: loader,
+                        loaders: loaders,
                         exclude: [...excludeFiles]
                     }
                 ]

diff --git a/scripts/webpack/libParts.js b/scripts/webpack/libParts.js
@@ -79,9 +79,9 @@ function createLibraryParts(rootDir, env = {}) {
         const extractor = new ExtractTextPlugin(filename);
         let loader;
         if (env.debug || env.prod) {
-            loader = 'css?sourceMap!sass?sourceMap';
+            loader = 'css-loader?sourceMap!sass-loader?sourceMap';
         } else {
-            loader = 'css!sass';
+            loader = 'css-loader!sass-loader';
         }
         return {
             entry: {
@@ -108,7 +108,7 @@ function createLibraryParts(rootDir, env = {}) {
                 rules: [
                     {
                         test: /\.html$/,
-                        loaders: ['ngtemplate?requireAngular&relativeTo=/src/browser/&prefix=ng-table/', 'html']
+                        loaders: ['ngtemplate-loader?requireAngular&relativeTo=/src/browser/&prefix=ng-table/', 'html-loader']
                     }
                 ]
             }

diff --git a/scripts/webpack/parts.js b/scripts/webpack/parts.js
@@ -20,7 +20,7 @@ function createParts(rootDir, env) {
         return {
             module: {
                 rules: [
-                    { test: /\.js$/, loaders: ['babel?cacheDirectory'], exclude: /node_modules/ }
+                    { test: /\.js$/, loaders: ['babel-loader?cacheDirectory'], exclude: /node_modules/ }
                 ]
             }
         }
@@ -29,8 +29,6 @@ function createParts(rootDir, env) {
     function prodOptimize() {
         return {
             plugins: [
-                // doesn't save anything in this small app. npm@3 mostly takes care of this
-                new webpack.optimize.DedupePlugin(),
                 new webpack.LoaderOptionsPlugin({
                     minimize: true,
                     debug: false,
@@ -93,7 +91,7 @@ function createParts(rootDir, env) {
                             /\.spec\.ts$/,
                             /node_modules/
                         ],
-                        loader: 'istanbul-instrumenter'
+                        loader: 'istanbul-instrumenter-loader'
                     }
                 ]
             }
@@ -112,7 +110,7 @@ function createParts(rootDir, env) {
                     {
                         test: /\.ts$/,
                         exclude: /node_modules/,
-                        loader: `awesome-typescript?tsconfig=${tsconfigPath}!angular1-template`
+                        loaders: [`awesome-typescript-loader?tsconfig=${tsconfigPath}`, 'angular1-template-loader']
                     }
                 ]
             }