Repository: zeppelin Updated Branches: refs/heads/master 31ceca797 -> d1606c248
http://git-wip-us.apache.org/repos/asf/zeppelin/blob/d1606c24/zeppelin-web/package.json ---------------------------------------------------------------------- diff --git a/zeppelin-web/package.json b/zeppelin-web/package.json index 3b7d2c0..b5c5acd 100644 --- a/zeppelin-web/package.json +++ b/zeppelin-web/package.json @@ -38,10 +38,10 @@ "diff-match-patch": "1.0.0" }, "devDependencies": { - "autoprefixer": "^6.5.4", - "babel-cli": "^6.18.0", + "autoprefixer": "^6.7.7", + "babel-cli": "^6.26.0", "babel-core": "^6.26.3", - "babel-loader": "^6.2.10", + "babel-loader": "^7.1.4", "babel-preset-env": "^1.7.0", "bower": "^1.8.0", "copy-webpack-plugin": "^4.0.1", @@ -55,8 +55,7 @@ "eslint-plugin-standard": "^3.0.1", "eslint-watch": "^3.1.0", "express": "^4.14.0", - "extract-text-webpack-plugin": "^1.0.1", - "file-loader": "^0.9.0", + "file-loader": "^2.0.0", "grunt": "^0.4.1", "grunt-cache-bust": "1.3.0", "grunt-cli": "^0.1.13", @@ -76,7 +75,7 @@ "grunt-svgmin": "^0.4.0", "grunt-usemin": "^2.1.1", "grunt-wiredep": "~2.0.0", - "html-webpack-plugin": "^2.24.1", + "html-webpack-plugin": "^3.2.0", "imports-loader": "^0.7.1", "istanbul-instrumenter-loader": "^0.2.0", "jasmine-core": "^2.5.2", @@ -89,17 +88,19 @@ "karma-spec-reporter": "0.0.31", "karma-webpack": "^1.8.1", "load-grunt-tasks": "^0.4.0", + "mini-css-extract-plugin": "^0.4.4", "ng-annotate-loader": "^0.2.0", "npm-run-all": "^3.1.2", - "postcss-loader": "^1.2.1", + "postcss-loader": "^3.0.0", "protractor": "^5.4.1", "raw-loader": "^0.5.1", "rimraf": "^2.5.4", "string-replace-webpack-plugin": "^0.1.3", "style-loader": "^0.13.1", "time-grunt": "^0.3.1", - "webpack": "^1.14.0", - "webpack-dev-server": "^2.11.3" + "webpack": "^4.24.0", + "webpack-cli": "^3.1.2", + "webpack-dev-server": "^3.1.10" }, "repository": { "type": "git", http://git-wip-us.apache.org/repos/asf/zeppelin/blob/d1606c24/zeppelin-web/webpack.config.js ---------------------------------------------------------------------- diff --git a/zeppelin-web/webpack.config.js b/zeppelin-web/webpack.config.js index 3c34924..ccb33df 100644 --- a/zeppelin-web/webpack.config.js +++ b/zeppelin-web/webpack.config.js @@ -19,9 +19,8 @@ var path = require('path'); var webpack = require('webpack'); -var autoprefixer = require('autoprefixer'); var HtmlWebpackPlugin = require('html-webpack-plugin'); -var ExtractTextPlugin = require('extract-text-webpack-plugin'); +var MiniCssExtractPlugin = require('mini-css-extract-plugin'); var CopyWebpackPlugin = require('copy-webpack-plugin'); var InsertLiveReloadPlugin = function InsertLiveReloadPlugin(options) { this.options = options || {}; @@ -138,19 +137,18 @@ module.exports = function makeWebpackConfig () { // Initialize module config.module = { - preLoaders: [], - loaders: [{ + rules: [{ // headroom 0.9.3 doesn't work with webpack // https://github.com/WickyNilliams/headroom.js/issues/213#issuecomment-281106943 test: require.resolve('headroom.js'), - loader: 'imports-loader?this=>window,define=>false,exports=>false' + use: 'imports-loader?this=>window,define=>false,exports=>false' }, { // JS LOADER // Reference: https://github.com/babel/babel-loader // Transpile .js files using babel-loader // Compiles ES6 and ES7 into ES5 code - test: /\.js$/, - loaders: ['ng-annotate', 'babel-loader'], + test: /\.(js|jsx)$/, + use: ['ng-annotate-loader', 'babel-loader'], exclude: /(node_modules|bower_components)/, }, { // CSS LOADER @@ -159,13 +157,23 @@ module.exports = function makeWebpackConfig () { // // Reference: https://github.com/postcss/postcss-loader // Postprocess your css with PostCSS plugins - test: /\.css$/, - // Reference: https://github.com/webpack/extract-text-webpack-plugin + test: /\.(sa|sc|c)ss$/, + // Reference: https://github.com/webpack-contrib/mini-css-extract-plugin // Extract css files in production builds // - // Reference: https://github.com/webpack/style-loader // Use style-loader in development. - loader: ExtractTextPlugin.extract('style-loader', 'css-loader?sourceMap!postcss-loader') + use: [ + !isProd ? 'style-loader' : MiniCssExtractPlugin.loader, + 'css-loader', + { + loader: 'postcss-loader', + options: { + ident: 'postcss', + plugins: [ + require('autoprefixer')() + ] + } + }] }, { // ASSET LOADER // Reference: https://github.com/webpack/file-loader @@ -174,20 +182,20 @@ module.exports = function makeWebpackConfig () { // Pass along the updated reference to your code // You can add here any file extension you want to get copied to your output test: /\.(png|jpg|jpeg|gif|svg|woff|woff2|ttf|eot)$/, - loader: 'file' + use: 'file-loader' }, { // HTML LOADER // Reference: https://github.com/webpack/raw-loader // Allow loading html through js test: /\.html$/, - loader: 'raw' + use: 'raw-loader' }, { // STRING REPLACE PLUGIN // reference: https://www.npmjs.com/package/string-replace-webpack-plugin // Allow for arbitrary strings to be replaced as part of the module build process // Configure replacements for file patterns test: /index.html$/, - loader: stringReplacePlugin.replace({ + use: stringReplacePlugin.replace({ replacements: [{ pattern: /WEB_PORT/ig, replacement: function (match, p1, offset, string) { @@ -199,26 +207,16 @@ module.exports = function makeWebpackConfig () { }; /** - * PostCSS - * Reference: https://github.com/postcss/autoprefixer-core - * Add vendor prefixes to your css - */ - config.postcss = [ - autoprefixer({ - browsers: ['last 2 version'] - }) - ]; - - /** * Plugins * Reference: http://webpack.github.io/docs/configuration.html#plugins * List: http://webpack.github.io/docs/list-of-plugins.html */ config.plugins = [ - // Reference: https://github.com/webpack/extract-text-webpack-plugin - // Extract css files - // Disabled when in test mode or not in build mode - new ExtractTextPlugin('[name].[hash].css', {disable: !isProd}), + // Reference: https://github.com/webpack-contrib/mini-css-extract-plugin + new MiniCssExtractPlugin({ + filename: !isProd ? '[name].css' : '[name].[hash].css', + chunkFilename: !isProd ? '[id].css' : '[id].[hash].css' + }) ]; // Skip rendering index.html in test mode @@ -242,7 +240,7 @@ module.exports = function makeWebpackConfig () { }) ) } - + if (isTest) { config.module.postLoaders = [ { @@ -256,34 +254,11 @@ module.exports = function makeWebpackConfig () { // Add build specific plugins if (isProd) { + config.optimization = { + noEmitOnErrors: true, + minimize: true + } config.plugins.push( - // Reference: http://webpack.github.io/docs/list-of-plugins.html#noerrorsplugin - // Only emit files when there are no errors - new webpack.NoErrorsPlugin(), - - // Reference: http://webpack.github.io/docs/list-of-plugins.html#dedupeplugin - // Dedupe modules in the output - new webpack.optimize.DedupePlugin(), - - // Reference: http://webpack.github.io/docs/list-of-plugins.html#uglifyjsplugin - // Minify all javascript, switch loaders to minimizing mode - new webpack.optimize.UglifyJsPlugin({ - mangle: { screw_ie8: true }, - preserveComments: 'some', - compress: { - screw_ie8: true, - warnings: false, - sequences: true, - dead_code: true, - conditionals: true, - booleans: true, - unused: true, - if_return: true, - join_vars: true, - drop_console: true, - } - }), - // Copy assets from the public folder // Reference: https://github.com/kevlened/copy-webpack-plugin new CopyWebpackPlugin([]) @@ -308,7 +283,7 @@ module.exports = function makeWebpackConfig () { hot: true, progress: true, contentBase: './src', - setup: function(app) { + before: function(app) { app.use('**/bower_components/', express.static(path.resolve(__dirname, './bower_components/'))); app.use('**/app/', express.static(path.resolve(__dirname, './src/app/'))); app.use('**/assets/', express.static(path.resolve(__dirname, './src/assets/')));