resolve( aurelia-toolbelt ): works with webpack 4

.vscode/launch.json

@@ -1,19 +1,46 @@
 {
-  // Use IntelliSense to find out which attributes exist for node debugging
-  // Use hover for the description of the existing attributes
-  // For further information visit https://go.microsoft.com/fwlink/?linkid=830387
-  "version": "0.2.0",
-  "configurations": [
-    {
-      "name": "Chrome",
-      "type": "chrome",
-      "request": "launch",
-      "url": "http://localhost:8080",
-      "webRoot": "${workspaceRoot}/src",
-      "userDataDir": "${workspaceRoot}/.chrome",
-      "sourceMapPathOverrides": {
-        "webpack:///./src/*": "${webRoot}/*"
-      }
-    }
-  ]
+   // Use IntelliSense to find out which attributes exist for C# debugging
+   // Use hover for the description of the existing attributes
+   // For further information visit https://github.com/OmniSharp/omnisharp-vscode/blob/master/debugger-launchjson.md
+   "version": "0.2.0",
+   "configurations": [
+        {
+            "name": ".NET Core Launch (web)",
+            "type": "coreclr",
+            "request": "launch",
+            "preLaunchTask": "build",
+            // If you have changed target frameworks, make sure to update the program path.
+            "program": "${workspaceFolder}/bin/Debug/netcoreapp2.0/Aurelia_Toolbelt_Webpack4.dll",
+            "args": [],
+            "cwd": "${workspaceFolder}",
+            "stopAtEntry": false,
+            "internalConsoleOptions": "openOnSessionStart",
+            "launchBrowser": {
+                "enabled": true,
+                "args": "${auto-detect-url}",
+                "windows": {
+                    "command": "cmd.exe",
+                    "args": "/C start ${auto-detect-url}"
+                },
+                "osx": {
+                    "command": "open"
+                },
+                "linux": {
+                    "command": "xdg-open"
+                }
+            },
+            "env": {
+                "ASPNETCORE_ENVIRONMENT": "Development"
+            },
+            "sourceFileMap": {
+                "/Views": "${workspaceFolder}/Views"
+            }
+        },
+        {
+            "name": ".NET Core Attach",
+            "type": "coreclr",
+            "request": "attach",
+            "processId": "${command:pickProcess}"
+        }
+    ,]
 }

.vscode/tasks.json

@@ -0,0 +1,15 @@
+{
+    "version": "2.0.0",
+    "tasks": [
+        {
+            "label": "build",
+            "command": "dotnet",
+            "type": "process",
+            "args": [
+                "build",
+                "${workspaceFolder}/Aurelia_Toolbelt_Webpack4.csproj"
+            ],
+            "problemMatcher": "$msCompile"
+        }
+    ]
+}

webpack.config.js

@@ -3,9 +3,17 @@ const HtmlWebpackPlugin = require('html-webpack-plugin');
 const CopyWebpackPlugin = require('copy-webpack-plugin');
 const ExtractTextPlugin = require('extract-text-webpack-plugin');
 const project = require('./aurelia_project/aurelia.json');
-const { AureliaPlugin, ModuleDependenciesPlugin } = require('aurelia-webpack-plugin');
-const { ProvidePlugin } = require('webpack');
-const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
+var webpack = require('webpack');
+const {
+  AureliaPlugin,
+  ModuleDependenciesPlugin
+} = require('aurelia-webpack-plugin');
+const {
+  ProvidePlugin
+} = require('webpack');
+const {
+  BundleAnalyzerPlugin
+} = require('webpack-bundle-analyzer');
 
 // config helpers:
 const ensureArray = (config) => config && (Array.isArray(config) ? config : [config]) || [];
@@ -19,18 +27,25 @@ const srcDir = path.resolve(__dirname, 'src');
 const nodeModulesDir = path.resolve(__dirname, 'node_modules');
 const baseUrl = '/';
 
-const cssRules = [
-  { loader: 'css-loader' },
-];
+const cssRules = [{
+  loader: 'css-loader'
+}, ];
 
-module.exports = ({production, server, extractCss, coverage, analyze} = {}) => ({
+module.exports = ({
+  production,
+  server,
+  extractCss,
+  coverage,
+  analyze
+} = {}) => ({
   resolve: {
-    extensions: ['.js'],
+    extensions: ['.ts', '.js'],
     modules: [srcDir, 'node_modules'],
   },
   entry: {
     app: ['aurelia-bootstrapper'],
-    //vendor: [],
+    vendor: ['bluebird']
+     , 'aurelia-toolbelt' : 'aurelia-toolbelt'
   },
   mode: production ? 'production' : 'development',
   output: {
@@ -40,7 +55,9 @@ module.exports = ({production, server, extractCss, coverage, analyze} = {}) => (
     sourceMapFilename: production ? '[name].[chunkhash].bundle.map' : '[name].[hash].bundle.map',
     chunkFilename: production ? '[name].[chunkhash].chunk.js' : '[name].[hash].chunk.js'
   },
-  performance: { hints: false },
+  performance: {
+    hints: false
+  },
   devServer: {
     contentBase: outDir,
     // serve index.html for all 404 (required for push-state)
@@ -53,15 +70,21 @@ module.exports = ({production, server, extractCss, coverage, analyze} = {}) => (
       // only when the issuer is a .js/.ts file, so the loaders are not applied inside html templates
       {
         test: /\.css$/i,
-        issuer: [{ not: [{ test: /\.html$/i }] }],
+        issuer: [{
+          not: [{
+            test: /\.html$/i
+          }]
+        }],
         use: extractCss ? ExtractTextPlugin.extract({
           fallback: 'style-loader',
           use: cssRules
         }) : ['style-loader', ...cssRules],
       },
       {
         test: /\.css$/i,
-        issuer: [{ test: /\.html$/i }],
+        issuer: [{
+          test: /\.html$/i
+        }],
         // CSS required in templates cannot be extracted safely
         // because Aurelia would try to require it again in runtime
         use: cssRules
@@ -76,34 +99,77 @@ module.exports = ({production, server, extractCss, coverage, analyze} = {}) => (
         use: ['css-loader', 'sass-loader'],
         issuer: /\.html?$/i
       },
-      { test: /\.html$/i, loader: 'html-loader' },
-      { test: /\.js$/i, loader: 'babel-loader', exclude: nodeModulesDir,
-        options: coverage ? { sourceMap: 'inline', plugins: [ 'istanbul' ] } : {},
+      {
+        test: /\.html$/i,
+        loader: 'html-loader'
       },
-      { test: /\.json$/i, loader: 'json-loader' },
+      {
+        test: /\.tsx?$/,
+        loader: "ts-loader"
+      },
+
+      // { test: /\.json$/i, loader: 'json-loader' },
+
+
       // use Bluebird as the global Promise implementation:
-      //{ test: /[\/\\]node_modules[\/\\]bluebird[\/\\].+\.js$/, loader: 'expose-loader?Promise' },
+      {
+        test: /[\/\\]node_modules[\/\\]bluebird[\/\\].+\.js$/,
+        loader: 'expose-loader?Promise'
+      },
+
+      { test: /[\/\\]node_modules[\/\\]jquery[\/\\].+\.js$/, loader: 'expose-loader?$!expose-loader?jQuery' },
       // embed small images and fonts as Data Urls and larger ones as files:
-      { test: /\.(png|gif|jpg|cur)$/i, loader: 'url-loader', options: { limit: 8192 } },
-      { test: /\.woff2(\?v=[0-9]\.[0-9]\.[0-9])?$/i, loader: 'url-loader', options: { limit: 10000, mimetype: 'application/font-woff2' } },
-      { test: /\.woff(\?v=[0-9]\.[0-9]\.[0-9])?$/i, loader: 'url-loader', options: { limit: 10000, mimetype: 'application/font-woff' } },
+      {
+        test: /\.(png|gif|jpg|cur)$/i,
+        loader: 'url-loader',
+        options: {
+          limit: 8192
+        }
+      },
+      {
+        test: /\.woff2(\?v=[0-9]\.[0-9]\.[0-9])?$/i,
+        loader: 'url-loader',
+        options: {
+          limit: 10000,
+          mimetype: 'application/font-woff2'
+        }
+      },
+      {
+        test: /\.woff(\?v=[0-9]\.[0-9]\.[0-9])?$/i,
+        loader: 'url-loader',
+        options: {
+          limit: 10000,
+          mimetype: 'application/font-woff'
+        }
+      },
       // load these fonts normally, as files:
-      { test: /\.(ttf|eot|svg|otf)(\?v=[0-9]\.[0-9]\.[0-9])?$/i, loader: 'file-loader' },
+      {
+        test: /\.(ttf|eot|svg|otf)(\?v=[0-9]\.[0-9]\.[0-9])?$/i,
+        loader: 'file-loader'
+      },
+      ...when(coverage, {
+        test: /\.[jt]s$/i,
+        loader: 'istanbul-instrumenter-loader',
+        include: srcDir,
+        exclude: [/\.{spec,test}\.[jt]s$/i],
+        enforce: 'post',
+        options: {
+          esModules: true
+        },
+      })
     ]
   },
   plugins: [
     new AureliaPlugin(),
-    // new ProvidePlugin({
-    //   'Promise': 'bluebird'
-    // }),
     new ProvidePlugin({
-      '$': 'jquery',
+      'Promise': 'bluebird',
       'jQuery': 'jquery',
-      'window.jQuery': 'jquery',
+      '$': 'jquery'
     }),
     new ModuleDependenciesPlugin({
-      'aurelia-testing': [ './compile-spy', './view-spy' ]
+      'aurelia-testing': ['./compile-spy', './view-spy']
     }),
+    new webpack.optimize.SplitChunksPlugin(),
     new HtmlWebpackPlugin({
       template: 'index.ejs',
       minify: production ? {
@@ -120,15 +186,19 @@ module.exports = ({production, server, extractCss, coverage, analyze} = {}) => (
       } : undefined,
       metadata: {
         // available in index.ejs //
-        title, server, baseUrl
+        title,
+        server,
+        baseUrl
       }
     }),
     ...when(extractCss, new ExtractTextPlugin({
       filename: production ? '[contenthash].css' : '[id].css',
       allChunks: true
     })),
-    ...when(production, new CopyWebpackPlugin([
-      { from: 'static/favicon.ico', to: 'favicon.ico' }])),
+    ...when(production, new CopyWebpackPlugin([{
+      from: 'static/favicon.ico',
+      to: 'favicon.ico'
+    }])),
     ...when(analyze, new BundleAnalyzerPlugin())
   ]
 });