Bläddra i källkod

Moved webpack config to seperate file. Added webpack dev server capability

Benjamin Giesinger 7 år sedan
förälder
incheckning
945ae8674b
3 ändrade filer med 70 tillägg och 32 borttagningar
  1. 14 31
      Gruntfile.js
  2. 5 1
      package.json
  3. 51 0
      webpack.config.js

+ 14 - 31
Gruntfile.js

@@ -1,6 +1,7 @@
 /*global module*/
 var webpack = require('webpack');
 var path = require('path');
+var  webpackCfg = require('./webpack.config.js');
 
 module.exports = function (grunt) {
     'use strict';
@@ -86,37 +87,17 @@ module.exports = function (grunt) {
         },
         // Webpack
         webpack: {
-          build: {
-            entry: ['./src/OSMD/OSMD.ts'],
-            output: {
-                path: path.resolve(__dirname, 'build'),
-                filename: 'osmd.js'
-             },
-             resolve: {
-                 // Add '.ts' and '.tsx' as a resolvable extension.
-                 extensions: ['.webpack.js', '.web.js', '.ts', '.tsx', '.js']
-             },
-             module: {
-                 loaders: [
-                     // all files with a '.ts' or '.tsx' extension will be handled by 'ts-loader'
-                     { test: /\.tsx?$/, loader: 'ts-loader' }
-                 ]
-             },
-    				 plugins: [
-               // build optimization plugins
-               new webpack.LoaderOptionsPlugin({
-                minimize: true,
-                debug: false
-              }),
-    					new webpack.optimize.UglifyJsPlugin({
-                  warnings: false,
-                  beautify: false,
-                  compress: true,
-                  comments: false,
-                  sourceMap: true
-                })
-    				]
-    			}
+          options: {
+            progress: true,
+          },
+          build: webpackCfg,
+          dev: Object.assign({ watch: true }, webpackCfg)
+        },
+        'webpack-dev-server': {
+          options: {
+              webpack: webpackCfg
+          },
+          start: webpackCfg.devServer,
         },
         // Karma setup
         karma: {
@@ -206,6 +187,8 @@ module.exports = function (grunt) {
     // Tests
     grunt.registerTask('test',        'Runs unit, regression and e2e tests.',        ['build:test', 'karma:ci']);
 
+    // Webpack dev server
+    grunt.registerTask("webpack-server", ["webpack-dev-server:start"]);
     // Default task (if grunt is run without any argument, used in contiuous integration)
     grunt.registerTask('default',     'Default task, running all other tasks. (CI)', ['test', 'build:demo', 'build:dist']);
 };

+ 5 - 1
package.json

@@ -72,6 +72,7 @@
     "grunt-karma": "^2.0.0",
     "grunt-ts": "^6.0.0-beta.3",
     "grunt-webpack": "^3.0.0",
+    "grunt-webpack-server": "^0.1.0",
     "http-server": "^0.10.0",
     "jshint": "^2.9.4",
     "karma": "^1.1.1",
@@ -91,7 +92,10 @@
     "tsify": "^3.0.0",
     "tslint": "^5.0.0",
     "typedoc": "^0.7.0",
-    "typescript": "^2.2.2"
+    "typescript": "^2.2.2",
+    "uglifyjs-webpack-plugin": "^0.4.3",
+    "webpack": "^3.5.5",
+    "webpack-dev-server": "^2.7.1"
   },
   "config": {
     "commitizen": {

+ 51 - 0
webpack.config.js

@@ -0,0 +1,51 @@
+const path = require('path');
+const webpack = require('webpack');
+
+module.exports = {
+  // entry: [
+  //   './src/OSMD/OSMD.ts'
+  //   // TODO: Add demo.js where the webdev server is implemented
+  //   //
+  // ],
+  entry: {
+    'osmd': './src/OSMD/OSMD.ts',
+    'demo': './demo/demo.js'
+  },
+  output: {
+      path: path.resolve(__dirname, 'build'),
+      filename: '[name].js',
+   },
+   resolve: {
+       // Add '.ts' and '.tsx' as a resolvable extension.
+       extensions: ['.webpack.js', '.web.js', '.ts', '.tsx', '.js']
+   },
+   module: {
+       loaders: [
+           // all files with a '.ts' or '.tsx' extension will be handled by 'ts-loader'
+           { test: /\.tsx?$/, loader: 'ts-loader' }
+       ]
+   },
+   plugins: [
+     // build optimization plugins
+     new webpack.LoaderOptionsPlugin({
+      minimize: true,
+      debug: false
+    }),
+    new webpack.optimize.UglifyJsPlugin({
+        warnings: false,
+        beautify: false,
+        compress: true,
+        comments: false,
+        sourceMap: true
+      })
+  ],
+  devServer: {
+    contentBase: [
+      path.join(__dirname, 'test/data'),
+      path.join(__dirname, 'demo')
+      // TODO: fill in paths for demo data
+    ],
+    port: 8000,
+    compress: false,
+  },
+};