diff --git a/package.json b/package.json index b396948..42c444b 100644 --- a/package.json +++ b/package.json @@ -172,7 +172,6 @@ "eslint-plugin-promise": "^3.8.0", "eslint-plugin-react": "^7.10.0", "eslint-plugin-testcafe": "^0.2.1", - "extract-text-webpack-plugin": "^4.0.0-beta.0", "fbjs-scripts": "^0.8.3", "file-loader": "^1.1.11", "flow-bin": "^0.77.0", @@ -188,9 +187,11 @@ "lerna": "^3.0.0-rc.0", "lint-staged": "^7.2.0", "lodash-webpack-plugin": "^0.11.5", + "mini-css-extract-plugin": "^0.4.1", "minimist": "^1.2.0", "node-sass": "^4.9.2", "npm-logical-tree": "^1.2.1", + "optimize-css-assets-webpack-plugin": "^5.0.0", "parcel": "^1.9.7", "prettier": "^1.14.0", "react-test-renderer": "^16.4.1", diff --git a/webpack.config.main.prod.js b/webpack.config.main.prod.js index 255ab48..792be7e 100644 --- a/webpack.config.main.prod.js +++ b/webpack.config.main.prod.js @@ -12,10 +12,10 @@ import CheckNodeEnv from './internals/scripts/CheckNodeEnv'; CheckNodeEnv('production'); export default merge.smart(baseConfig, { - mode: 'production', - devtool: 'source-map', + mode: 'production', + target: 'electron-main', entry: './app/main.dev', @@ -25,15 +25,17 @@ export default merge.smart(baseConfig, { filename: './app/main.prod.js' }, - plugins: [ - new UglifyJSPlugin({ - parallel: true, - sourceMap: true, - cache: true - }), - - // new ShakePlugin(), + optimization: { + minimizer: [ + new UglifyJSPlugin({ + parallel: true, + sourceMap: true, + cache: true + }) + ] + }, + plugins: [ new BundleAnalyzerPlugin({ analyzerMode: process.env.OPEN_ANALYZER === 'true' ? 'server' : 'disabled', diff --git a/webpack.config.renderer.dev.js b/webpack.config.renderer.dev.js index f4677b8..f65b460 100644 --- a/webpack.config.renderer.dev.js +++ b/webpack.config.renderer.dev.js @@ -14,7 +14,6 @@ import chalk from 'chalk'; import merge from 'webpack-merge'; import { spawn, execSync } from 'child_process'; import ErrorOverlayPlugin from 'error-overlay-webpack-plugin'; -import ExtractTextPlugin from 'extract-text-webpack-plugin'; import baseConfig from './webpack.config.base'; import CheckNodeEnv from './internals/scripts/CheckNodeEnv'; @@ -238,10 +237,6 @@ export default merge.smart(baseConfig, { new webpack.LoaderOptionsPlugin({ debug: true - }), - - new ExtractTextPlugin({ - filename: '[name].css' }) ], diff --git a/webpack.config.renderer.prod.js b/webpack.config.renderer.prod.js index fc77009..d351ac4 100644 --- a/webpack.config.renderer.prod.js +++ b/webpack.config.renderer.prod.js @@ -4,22 +4,22 @@ import path from 'path'; import webpack from 'webpack'; -import ExtractTextPlugin from 'extract-text-webpack-plugin'; +import MiniCssExtractPlugin from 'mini-css-extract-plugin'; +import OptimizeCSSAssetsPlugin from 'optimize-css-assets-webpack-plugin'; import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer'; -import SWPrecacheWebpackPlugin from 'sw-precache-webpack-plugin'; import merge from 'webpack-merge'; import UglifyJSPlugin from 'uglifyjs-webpack-plugin'; -import LodashModuleReplacementPlugin from 'lodash-webpack-plugin'; +import SWPrecacheWebpackPlugin from 'sw-precache-webpack-plugin'; import baseConfig from './webpack.config.base'; import CheckNodeEnv from './internals/scripts/CheckNodeEnv'; CheckNodeEnv('production'); export default merge.smart(baseConfig, { - mode: 'production', - devtool: 'source-map', + mode: 'production', + target: 'electron-renderer', entry: './app/index', @@ -35,69 +35,83 @@ export default merge.smart(baseConfig, { // Extract all .global.css to style.css as is { test: /\.global\.css$/, - use: ExtractTextPlugin.extract({ - publicPath: '../', - use: { - loader: 'css-loader', + use: [ + { + loader: MiniCssExtractPlugin.loader, options: { - minimize: true + publicPath: './' } }, - fallback: 'style-loader' - }) + { + loader: 'css-loader', + options: { + sourceMap: true + } + } + ] }, // Pipe other styles through css modules and append to style.css { test: /^((?!\.global).)*\.css$/, - use: ExtractTextPlugin.extract({ - use: { + use: [ + { + loader: MiniCssExtractPlugin.loader + }, + { loader: 'css-loader', options: { modules: true, - minimize: true, - importLoaders: 1, - localIdentName: '[name]__[local]__[hash:base64:5]' + localIdentName: '[name]__[local]__[hash:base64:5]', + sourceMap: true } } - }) + ] }, // Add SASS support - compile all .global.scss files and pipe it to style.css { - test: /\.global\.scss$/, - use: ExtractTextPlugin.extract({ - use: [ - { - loader: 'css-loader', - options: { - minimize: true - } - }, - { - loader: 'sass-loader' + test: /\.global\.(scss|sass)$/, + use: [ + { + loader: MiniCssExtractPlugin.loader + }, + { + loader: 'css-loader', + options: { + sourceMap: true, + importLoaders: 1 } - ], - fallback: 'style-loader' - }) + }, + { + loader: 'sass-loader', + options: { + sourceMap: true + } + } + ] }, // Add SASS support - compile all other .scss files and pipe it to style.css { - test: /^((?!\.global).)*\.scss$/, - use: ExtractTextPlugin.extract({ - use: [ - { - loader: 'css-loader', - options: { - modules: true, - minimize: true, - importLoaders: 1, - localIdentName: '[name]__[local]__[hash:base64:5]' - } - }, - { - loader: 'sass-loader' + test: /^((?!\.global).)*\.(scss|sass)$/, + use: [ + { + loader: MiniCssExtractPlugin.loader + }, + { + loader: 'css-loader', + options: { + modules: true, + importLoaders: 1, + localIdentName: '[name]__[local]__[hash:base64:5]', + sourceMap: true } - ] - }) + }, + { + loader: 'sass-loader', + options: { + sourceMap: true + } + } + ] }, // WOFF Font { @@ -156,6 +170,24 @@ export default merge.smart(baseConfig, { ] }, + optimization: { + minimizer: [ + new UglifyJSPlugin({ + parallel: true, + sourceMap: true, + cache: true + }), + new OptimizeCSSAssetsPlugin({ + cssProcessorOptions: { + map: { + inline: false, + annotation: true + } + } + }) + ] + }, + plugins: [ /** * Create global constants which can be configured at compile time. @@ -170,21 +202,8 @@ export default merge.smart(baseConfig, { NODE_ENV: 'production' }), - new UglifyJSPlugin({ - parallel: true, - sourceMap: true, - cache: true - }), - - // new ShakePlugin(), - - new LodashModuleReplacementPlugin(), - - // new ExtractTextPlugin('style.css'), - - new ExtractTextPlugin({ - filename: 'style.css', - allChunks: true + new MiniCssExtractPlugin({ + filename: 'style.css' }), new BundleAnalyzerPlugin({ diff --git a/yarn.lock b/yarn.lock index b015461..82a263d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -805,6 +805,17 @@ "@webassemblyjs/wast-parser" "1.5.13" long "^3.2.0" +"@webpack-contrib/schema-utils@^1.0.0-beta.0": + version "1.0.0-beta.0" + resolved "https://registry.yarnpkg.com/@webpack-contrib/schema-utils/-/schema-utils-1.0.0-beta.0.tgz#bf9638c9464d177b48209e84209e23bee2eb4f65" + dependencies: + ajv "^6.1.0" + ajv-keywords "^3.1.0" + chalk "^2.3.2" + strip-ansi "^4.0.0" + text-table "^0.2.0" + webpack-log "^1.1.2" + JSONStream@^0.8.4: version "0.8.4" resolved "https://registry.yarnpkg.com/JSONStream/-/JSONStream-0.8.4.tgz#91657dfe6ff857483066132b4618b62e8f4887bd" @@ -1335,7 +1346,7 @@ async@^1.4.0, async@^1.5.2: version "1.5.2" resolved "https://registry.yarnpkg.com/async/-/async-1.5.2.tgz#ec6a61ae56480c0c3cb241c95618e20892f9672a" -async@^2.0.0, async@^2.1.4, async@^2.4.1: +async@^2.0.0, async@^2.1.4: version "2.6.1" resolved "https://registry.yarnpkg.com/async/-/async-2.6.1.tgz#b245a23ca71930044ec53fa46aa00a3e87c6a610" dependencies: @@ -2960,7 +2971,7 @@ chalk@1.1.3, chalk@^1.0.0, chalk@^1.1.0, chalk@^1.1.1, chalk@^1.1.3: strip-ansi "^3.0.0" supports-color "^2.0.0" -chalk@^2.0.0, chalk@^2.0.1, chalk@^2.1.0, chalk@^2.3.0, chalk@^2.3.1, chalk@^2.4.0, chalk@^2.4.1: +chalk@^2.0.0, chalk@^2.0.1, chalk@^2.1.0, chalk@^2.3.0, chalk@^2.3.1, chalk@^2.3.2, chalk@^2.4.0, chalk@^2.4.1: version "2.4.1" resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.1.tgz#18c49ab16a037b6eb0152cc83e3471338215b66e" dependencies: @@ -4015,6 +4026,15 @@ cssnano@^4.0.0: is-resolvable "^1.0.0" postcss "^6.0.0" +cssnano@^4.0.2: + version "4.0.5" + resolved "https://registry.yarnpkg.com/cssnano/-/cssnano-4.0.5.tgz#8789b5fdbe7be05d8a0f7e45c4c789ebe712f5aa" + dependencies: + cosmiconfig "^5.0.0" + cssnano-preset-default "^4.0.0" + is-resolvable "^1.0.0" + postcss "^6.0.0" + csso@^3.5.0: version "3.5.1" resolved "https://registry.yarnpkg.com/csso/-/csso-3.5.1.tgz#7b9eb8be61628973c1b261e169d2f024008e758b" @@ -5438,15 +5458,6 @@ extglob@^2.0.4: snapdragon "^0.8.1" to-regex "^3.0.1" -extract-text-webpack-plugin@^4.0.0-beta.0: - version "4.0.0-beta.0" - resolved "https://registry.yarnpkg.com/extract-text-webpack-plugin/-/extract-text-webpack-plugin-4.0.0-beta.0.tgz#f7361d7ff430b42961f8d1321ba8c1757b5d4c42" - dependencies: - async "^2.4.1" - loader-utils "^1.1.0" - schema-utils "^0.4.5" - webpack-sources "^1.1.0" - extract-zip@^1.0.3, extract-zip@^1.6.5: version "1.6.7" resolved "https://registry.yarnpkg.com/extract-zip/-/extract-zip-1.6.7.tgz#a840b4b8af6403264c8db57f4f1a74333ef81fe9" @@ -7931,6 +7942,13 @@ known-css-properties@^0.6.0: version "0.6.1" resolved "https://registry.yarnpkg.com/known-css-properties/-/known-css-properties-0.6.1.tgz#31b5123ad03d8d1a3f36bd4155459c981173478b" +last-call-webpack-plugin@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/last-call-webpack-plugin/-/last-call-webpack-plugin-3.0.0.tgz#9742df0e10e3cf46e5c0381c2de90d3a7a2d7555" + dependencies: + lodash "^4.17.5" + webpack-sources "^1.1.0" + latest-version@^3.0.0: version "3.1.0" resolved "https://registry.yarnpkg.com/latest-version/-/latest-version-3.1.0.tgz#a205383fea322b33b5ae3b18abee0dc2f356ee15" @@ -8599,6 +8617,14 @@ min-document@^2.19.0: dependencies: dom-walk "^0.1.0" +mini-css-extract-plugin@^0.4.1: + version "0.4.1" + resolved "https://registry.yarnpkg.com/mini-css-extract-plugin/-/mini-css-extract-plugin-0.4.1.tgz#d2bcf77bb2596b8e4bd9257e43d3f9164c2e86cb" + dependencies: + "@webpack-contrib/schema-utils" "^1.0.0-beta.0" + loader-utils "^1.1.0" + webpack-sources "^1.1.0" + minimalistic-assert@^1.0.0, minimalistic-assert@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz#2e194de044626d4a10e7f7fbc00ce73e83e4d5c7" @@ -9296,6 +9322,13 @@ optimist@^0.6.1, optimist@~0.6.1: minimist "~0.0.1" wordwrap "~0.0.2" +optimize-css-assets-webpack-plugin@^5.0.0: + version "5.0.0" + resolved "https://registry.yarnpkg.com/optimize-css-assets-webpack-plugin/-/optimize-css-assets-webpack-plugin-5.0.0.tgz#8c9adf00e841871f627f82a8097a4f9fcc314de4" + dependencies: + cssnano "^4.0.2" + last-call-webpack-plugin "^3.0.0" + optionator@^0.8.1, optionator@^0.8.2: version "0.8.2" resolved "https://registry.yarnpkg.com/optionator/-/optionator-0.8.2.tgz#364c5e409d3f4d6301d6c0b4c05bba50180aeb64"