diff --git a/awx/ui/build/webpack.base.js b/awx/ui/build/webpack.base.js index 6a8c4ed781..e0b6998974 100644 --- a/awx/ui/build/webpack.base.js +++ b/awx/ui/build/webpack.base.js @@ -27,7 +27,7 @@ const VENDOR_ENTRY = path.join(SOURCE_PATH, 'vendor.js'); const INDEX_ENTRY = path.join(CLIENT_PATH, 'index.template.ejs'); const INDEX_OUTPUT = path.join(UI_PATH, 'templates/ui/index.html'); const THEME_ENTRY = path.join(LIB_PATH, 'theme', 'index.less'); -const OUTPUT = 'js/[name].[hash].js'; +const OUTPUT = 'js/[name].[chunkhash].js'; const CHUNKS = ['vendor', 'app']; const VENDOR = VENDOR_ENTRY; @@ -108,7 +108,7 @@ const base = { CodeMirror: 'codemirror', jsonlint: 'codemirror.jsonlint' }), - new ExtractTextPlugin('css/[name].[hash].css'), + new ExtractTextPlugin('css/[name].[chunkhash].css'), new CleanWebpackPlugin([STATIC_PATH, COVERAGE_PATH, LANGUAGES_PATH], { root: UI_PATH, verbose: false diff --git a/awx/ui/build/webpack.production.js b/awx/ui/build/webpack.production.js index feaa6d13f7..4c61eef4a4 100644 --- a/awx/ui/build/webpack.production.js +++ b/awx/ui/build/webpack.production.js @@ -26,6 +26,11 @@ const production = { inject: false, chunks: CHUNKS, chunksSortMode: chunk => chunk.names[0] === 'vendor' ? -1 : 1 + }), + new webpack.DefinePlugin({ + 'process.env': { + 'NODE_ENV': JSON.stringify('production') + } }) ] }; diff --git a/awx/ui/build/webpack.watch.js b/awx/ui/build/webpack.watch.js index 85431adddc..1c2f9e5270 100644 --- a/awx/ui/build/webpack.watch.js +++ b/awx/ui/build/webpack.watch.js @@ -3,14 +3,21 @@ const path = require('path'); const _ = require('lodash'); const webpack = require('webpack'); const HtmlWebpackHarddiskPlugin = require('html-webpack-harddisk-plugin'); +const HardSourceWebpackPlugin = require('hard-source-webpack-plugin'); const TARGET_PORT = _.get(process.env, 'npm_package_config_django_port', 8043); const TARGET_HOST = _.get(process.env, 'npm_package_config_django_host', 'https://localhost'); const TARGET = `https://${TARGET_HOST}:${TARGET_PORT}`; +const OUTPUT = 'js/[name].js'; const development = require('./webpack.development'); const watch = { + cache: true, + devtool: 'cheap-source-map', + output: { + filename: OUTPUT + }, module: { rules: [ { @@ -22,10 +29,24 @@ const watch = { ] }, plugins: [ + new HardSourceWebpackPlugin({ + cacheDirectory: 'node_modules/.cache/hard-source/[confighash]', + recordsPath: 'node_modules/.cache/hard-source/[confighash]/records.json', + configHash: config => { + return require('node-object-hash')({ sort: false }).hash(config); + }, + environmentHash: { + root: process.cwd(), + directories: ['node_modules'], + files: ['package.json'] + } + }), new HtmlWebpackHarddiskPlugin(), new webpack.HotModuleReplacementPlugin() ], devServer: { + hot: true, + inline: true, contentBase: path.resolve(__dirname, '..', 'static'), stats: 'minimal', publicPath: '/static/', @@ -35,7 +56,8 @@ const watch = { '/': { target: TARGET, secure: false, - ws: false + ws: false, + bypass: req => req.originalUrl.includes('hot-update.json') }, '/websocket': { target: TARGET, @@ -50,4 +72,3 @@ watch.module.rules = development.module.rules.concat(watch.module.rules); watch.plugins = development.plugins.concat(watch.plugins); module.exports = _.merge(development, watch); - diff --git a/awx/ui/package.json b/awx/ui/package.json index a5f520ece7..505a27810b 100644 --- a/awx/ui/package.json +++ b/awx/ui/package.json @@ -54,6 +54,7 @@ "grunt-concurrent": "^2.3.0", "grunt-contrib-jshint": "^1.0.0", "grunt-newer": "^1.2.0", + "hard-source-webpack-plugin": "^0.4.9", "html-loader": "^0.5.1", "html-webpack-harddisk-plugin": "^0.1.0", "html-webpack-plugin": "^2.30.1", @@ -79,9 +80,8 @@ "load-grunt-tasks": "^3.5.0", "ngtemplate-loader": "^2.0.1", "nightwatch": "^0.9.16", + "node-object-hash": "^1.3.0", "phantomjs-prebuilt": "^2.1.12", - "script-loader": "^0.7.0", - "style-loader": "^0.18.2", "time-grunt": "^1.4.0", "uglifyjs-webpack-plugin": "^0.4.6", "webpack": "^3.0.0",