From af9f3d671a2eb785b068391a5d81ebc23fe6f6dd Mon Sep 17 00:00:00 2001 From: ALiangLiang Date: Fri, 19 Jan 2018 05:21:02 +0800 Subject: [PATCH 1/2] Fixed #5 --- template/core/webpack.base.js | 12 +++--------- template/core/webpack.dev.js | 8 +++++++- template/core/webpack.prod.js | 8 +++++++- 3 files changed, 17 insertions(+), 11 deletions(-) diff --git a/template/core/webpack.base.js b/template/core/webpack.base.js index 0cae543..b69c25f 100644 --- a/template/core/webpack.base.js +++ b/template/core/webpack.base.js @@ -1,7 +1,7 @@ const path = require('path') const webpack = require('webpack') const ChromeReloadPlugin = require('wcer') -const {cssLoaders, htmlPage} = require('./tools') +const { cssLoaders } = require('./tools') const CopyWebpackPlugin = require('copy-webpack-plugin') let resolve = dir => path.join(__dirname, '..', 'src', dir) @@ -10,7 +10,7 @@ module.exports = { tab: resolve('./tab'), popup: resolve('./popup'), options: resolve('./options'), - content: resolve('./content'), + content: resolve('./content'), devtools: resolve('./devtools'), background: resolve('./backend'), panel: resolve('./devtools/panel'), @@ -90,12 +90,6 @@ module.exports = { ] }, plugins: [ - htmlPage('home', 'app', ['tab']), - htmlPage('popup', 'popup', ['popup']), - htmlPage('panel', 'panel', ['panel']), - htmlPage('devtools', 'devtools', ['devtools']), - htmlPage('options', 'options', ['options']), - htmlPage('background', 'background', ['background']), new CopyWebpackPlugin([{ from: path.join(__dirname, '..', 'static') }]), new ChromeReloadPlugin({ port: 9090, @@ -103,4 +97,4 @@ module.exports = { }), ], performance: { hints: false }, -} \ No newline at end of file +} diff --git a/template/core/webpack.dev.js b/template/core/webpack.dev.js index 8357e25..3b5831b 100644 --- a/template/core/webpack.dev.js +++ b/template/core/webpack.dev.js @@ -3,7 +3,7 @@ const webpack = require('webpack') const merge = require('webpack-merge') const baseWebpack = require('./webpack.base') const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin') -const {styleLoaders} = require('./tools') +const { styleLoaders, htmlPage } = require('./tools') module.exports = merge(baseWebpack, { // cheap-module-eval-source-map быстрее для разработки watch: true, @@ -12,6 +12,12 @@ module.exports = merge(baseWebpack, { }, devtool: '#cheap-module-eval-source-map', plugins: [ + htmlPage('home', 'app', ['tab']), + htmlPage('popup', 'popup', ['popup']), + htmlPage('panel', 'panel', ['panel']), + htmlPage('devtools', 'devtools', ['devtools']), + htmlPage('options', 'options', ['options']), + htmlPage('background', 'background', ['background']), new webpack.NoEmitOnErrorsPlugin(), new webpack.DefinePlugin({ 'process.env.NODE_ENV': '"development"' diff --git a/template/core/webpack.prod.js b/template/core/webpack.prod.js index 03ec904..a47a927 100644 --- a/template/core/webpack.prod.js +++ b/template/core/webpack.prod.js @@ -6,13 +6,19 @@ const baseWebpack = require('./webpack.base') const CleanWebpackPlugin = require('clean-webpack-plugin') const ExtractTextPlugin = require('extract-text-webpack-plugin') const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin') -const {styleLoaders} = require('./tools') +const { styleLoaders, htmlPage } = require('./tools') module.exports = merge(baseWebpack, { devtool: '#cheap-module-eval-source-map', module: { rules: styleLoaders({ extract: true, sourceMap: true }) }, plugins: [ + htmlPage('home', 'app', ['manifest', 'vendor', 'tab']), + htmlPage('popup', 'popup', ['manifest', 'vendor', 'popup']), + htmlPage('panel', 'panel', ['manifest', 'vendor', 'panel']), + htmlPage('devtools', 'devtools', ['manifest', 'vendor', 'devtools']), + htmlPage('options', 'options', ['manifest', 'vendor', 'options']), + htmlPage('background', 'background', ['manifest', 'vendor', 'background']), new CleanWebpackPlugin(['build/*.*']), new webpack.NoEmitOnErrorsPlugin(), new webpack.DefinePlugin({ From 62e69cfd2e2d168861887e51665248270268b8ab Mon Sep 17 00:00:00 2001 From: ALiangLiang Date: Wed, 21 Feb 2018 17:08:35 +0800 Subject: [PATCH 2/2] move CommonsChunkPlugin from webpack.prod.js to base.js --- template/core/webpack.base.js | 24 +++++++++++++++++++++++- template/core/webpack.dev.js | 8 +------- template/core/webpack.prod.js | 26 ++------------------------ template/src/manifest.js | 6 +++++- 4 files changed, 31 insertions(+), 33 deletions(-) diff --git a/template/core/webpack.base.js b/template/core/webpack.base.js index b69c25f..ab983c5 100644 --- a/template/core/webpack.base.js +++ b/template/core/webpack.base.js @@ -1,7 +1,7 @@ const path = require('path') const webpack = require('webpack') const ChromeReloadPlugin = require('wcer') -const { cssLoaders } = require('./tools') +const { cssLoaders, htmlPage } = require('./tools') const CopyWebpackPlugin = require('copy-webpack-plugin') let resolve = dir => path.join(__dirname, '..', 'src', dir) @@ -90,11 +90,33 @@ module.exports = { ] }, plugins: [ + htmlPage('home', 'app', ['manifest', 'vendor', 'tab']), + htmlPage('popup', 'popup', ['manifest', 'vendor', 'popup']), + htmlPage('panel', 'panel', ['manifest', 'vendor', 'panel']), + htmlPage('devtools', 'devtools', ['manifest', 'vendor', 'devtools']), + htmlPage('options', 'options', ['manifest', 'vendor', 'options']), + htmlPage('background', 'background', ['manifest', 'vendor', 'background']), new CopyWebpackPlugin([{ from: path.join(__dirname, '..', 'static') }]), new ChromeReloadPlugin({ port: 9090, manifest: path.join(__dirname, '..', 'src', 'manifest.js') }), + new webpack.optimize.CommonsChunkPlugin({ + name: 'vendor', + minChunks: function (module) { + return ( + module.resource && + /\.js$/.test(module.resource) && + module.resource.indexOf( + path.join(__dirname, '../node_modules') + ) === 0 + ) + } + }), + new webpack.optimize.CommonsChunkPlugin({ + name: 'manifest', + chunks: ['vendor'] + }) ], performance: { hints: false }, } diff --git a/template/core/webpack.dev.js b/template/core/webpack.dev.js index 3b5831b..9d7529b 100644 --- a/template/core/webpack.dev.js +++ b/template/core/webpack.dev.js @@ -3,7 +3,7 @@ const webpack = require('webpack') const merge = require('webpack-merge') const baseWebpack = require('./webpack.base') const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin') -const { styleLoaders, htmlPage } = require('./tools') +const { styleLoaders } = require('./tools') module.exports = merge(baseWebpack, { // cheap-module-eval-source-map быстрее для разработки watch: true, @@ -12,12 +12,6 @@ module.exports = merge(baseWebpack, { }, devtool: '#cheap-module-eval-source-map', plugins: [ - htmlPage('home', 'app', ['tab']), - htmlPage('popup', 'popup', ['popup']), - htmlPage('panel', 'panel', ['panel']), - htmlPage('devtools', 'devtools', ['devtools']), - htmlPage('options', 'options', ['options']), - htmlPage('background', 'background', ['background']), new webpack.NoEmitOnErrorsPlugin(), new webpack.DefinePlugin({ 'process.env.NODE_ENV': '"development"' diff --git a/template/core/webpack.prod.js b/template/core/webpack.prod.js index a47a927..5b76998 100644 --- a/template/core/webpack.prod.js +++ b/template/core/webpack.prod.js @@ -6,19 +6,13 @@ const baseWebpack = require('./webpack.base') const CleanWebpackPlugin = require('clean-webpack-plugin') const ExtractTextPlugin = require('extract-text-webpack-plugin') const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin') -const { styleLoaders, htmlPage } = require('./tools') +const { styleLoaders } = require('./tools') module.exports = merge(baseWebpack, { devtool: '#cheap-module-eval-source-map', module: { rules: styleLoaders({ extract: true, sourceMap: true }) }, plugins: [ - htmlPage('home', 'app', ['manifest', 'vendor', 'tab']), - htmlPage('popup', 'popup', ['manifest', 'vendor', 'popup']), - htmlPage('panel', 'panel', ['manifest', 'vendor', 'panel']), - htmlPage('devtools', 'devtools', ['manifest', 'vendor', 'devtools']), - htmlPage('options', 'options', ['manifest', 'vendor', 'options']), - htmlPage('background', 'background', ['manifest', 'vendor', 'background']), new CleanWebpackPlugin(['build/*.*']), new webpack.NoEmitOnErrorsPlugin(), new webpack.DefinePlugin({ @@ -32,22 +26,6 @@ module.exports = merge(baseWebpack, { new ExtractTextPlugin({ filename: 'css/[name].[contenthash].css' }), - new webpack.HashedModuleIdsPlugin(), - new webpack.optimize.CommonsChunkPlugin({ - name: 'vendor', - minChunks: function (module) { - return ( - module.resource && - /\.js$/.test(module.resource) && - module.resource.indexOf( - path.join(__dirname, '../node_modules') - ) === 0 - ) - } - }), - new webpack.optimize.CommonsChunkPlugin({ - name: 'manifest', - chunks: ['vendor'] - }) + new webpack.HashedModuleIdsPlugin() ] }) diff --git a/template/src/manifest.js b/template/src/manifest.js index 3ce8b6f..088bd8d 100644 --- a/template/src/manifest.js +++ b/template/src/manifest.js @@ -31,7 +31,11 @@ module.exports = { devtools_page: 'pages/devtools.html', options_page: 'pages/options.html', content_scripts: [{ - js: [ 'js/inject.js' ], + js: [ + 'js/manifest.js', + 'js/vendor.js', + 'js/content.js' + ], run_at: 'document_end', matches: [''], all_frames: true