正在显示
1 个修改的文件
包含
38 行增加
和
20 行删除
| ... | @@ -2,11 +2,11 @@ | ... | @@ -2,11 +2,11 @@ |
| 2 | 2 | ||
| 3 | process.env.BABEL_ENV = 'renderer' | 3 | process.env.BABEL_ENV = 'renderer' |
| 4 | 4 | ||
| 5 | -const os = require('os') | ||
| 6 | const path = require('path') | 5 | const path = require('path') |
| 7 | const { dependencies } = require('../package.json') | 6 | const { dependencies } = require('../package.json') |
| 8 | const webpack = require('webpack') | 7 | const webpack = require('webpack') |
| 9 | const config = require('../config') | 8 | const config = require('../config') |
| 9 | +const IsWeb = process.env.ENV_TARGET === 'web' | ||
| 10 | 10 | ||
| 11 | const MinifyPlugin = require("babel-minify-webpack-plugin"); | 11 | const MinifyPlugin = require("babel-minify-webpack-plugin"); |
| 12 | const CopyWebpackPlugin = require('copy-webpack-plugin') | 12 | const CopyWebpackPlugin = require('copy-webpack-plugin') |
| ... | @@ -14,9 +14,6 @@ const MiniCssExtractPlugin = require('mini-css-extract-plugin') | ... | @@ -14,9 +14,6 @@ const MiniCssExtractPlugin = require('mini-css-extract-plugin') |
| 14 | const HtmlWebpackPlugin = require('html-webpack-plugin') | 14 | const HtmlWebpackPlugin = require('html-webpack-plugin') |
| 15 | const TerserPlugin = require('terser-webpack-plugin'); | 15 | const TerserPlugin = require('terser-webpack-plugin'); |
| 16 | const { VueLoaderPlugin } = require('vue-loader') | 16 | const { VueLoaderPlugin } = require('vue-loader') |
| 17 | -const HappyPack = require('happypack') | ||
| 18 | -const HappyThreadPool = HappyPack.ThreadPool({ size: os.cpus().length > 4 ? 4 : os.cpus().length }) | ||
| 19 | - | ||
| 20 | function resolve(dir) { | 17 | function resolve(dir) { |
| 21 | return path.join(__dirname, '..', dir) | 18 | return path.join(__dirname, '..', dir) |
| 22 | } | 19 | } |
| ... | @@ -27,7 +24,7 @@ function resolve(dir) { | ... | @@ -27,7 +24,7 @@ function resolve(dir) { |
| 27 | * that provide pure *.vue files that need compiling | 24 | * that provide pure *.vue files that need compiling |
| 28 | * https://simulatedgreg.gitbooks.io/electron-vue/content/en/webpack-configurations.html#white-listing-externals | 25 | * https://simulatedgreg.gitbooks.io/electron-vue/content/en/webpack-configurations.html#white-listing-externals |
| 29 | */ | 26 | */ |
| 30 | -let whiteListedModules = ['vue', "element-ui"] | 27 | +let whiteListedModules = IsWeb ? [] : ['vue', "element-ui"] |
| 31 | 28 | ||
| 32 | let rendererConfig = { | 29 | let rendererConfig = { |
| 33 | devtool: '#cheap-module-eval-source-map', | 30 | devtool: '#cheap-module-eval-source-map', |
| ... | @@ -97,7 +94,12 @@ let rendererConfig = { | ... | @@ -97,7 +94,12 @@ let rendererConfig = { |
| 97 | }, | 94 | }, |
| 98 | { | 95 | { |
| 99 | test: /\.js$/, | 96 | test: /\.js$/, |
| 100 | - use: 'happypack/loader?id=HappyRendererBabel', | 97 | + use: ['thread-loader', { |
| 98 | + loader: 'babel-loader', | ||
| 99 | + options: { | ||
| 100 | + cacheDirectory: true | ||
| 101 | + } | ||
| 102 | + }], | ||
| 101 | exclude: /node_modules/ | 103 | exclude: /node_modules/ |
| 102 | }, | 104 | }, |
| 103 | { | 105 | { |
| ... | @@ -164,7 +166,8 @@ let rendererConfig = { | ... | @@ -164,7 +166,8 @@ let rendererConfig = { |
| 164 | new VueLoaderPlugin(), | 166 | new VueLoaderPlugin(), |
| 165 | new MiniCssExtractPlugin({ filename: 'styles.css' }), | 167 | new MiniCssExtractPlugin({ filename: 'styles.css' }), |
| 166 | new webpack.DefinePlugin({ | 168 | new webpack.DefinePlugin({ |
| 167 | - 'process.env': process.env.NODE_ENV === 'production' ? config.build.env : config.dev.env | 169 | + 'process.env': process.env.NODE_ENV === 'production' ? config.build.env : config.dev.env, |
| 170 | + 'process.env.IS_WEB': IsWeb | ||
| 168 | }), | 171 | }), |
| 169 | new HtmlWebpackPlugin({ | 172 | new HtmlWebpackPlugin({ |
| 170 | filename: 'index.html', | 173 | filename: 'index.html', |
| ... | @@ -192,21 +195,11 @@ let rendererConfig = { | ... | @@ -192,21 +195,11 @@ let rendererConfig = { |
| 192 | }), | 195 | }), |
| 193 | new webpack.HotModuleReplacementPlugin(), | 196 | new webpack.HotModuleReplacementPlugin(), |
| 194 | new webpack.NoEmitOnErrorsPlugin(), | 197 | new webpack.NoEmitOnErrorsPlugin(), |
| 195 | - new HappyPack({ | ||
| 196 | - id: 'HappyRendererBabel', | ||
| 197 | - loaders: [{ | ||
| 198 | - loader: 'babel-loader', | ||
| 199 | - options: { | ||
| 200 | - cacheDirectory: true | ||
| 201 | - } | ||
| 202 | - }], | ||
| 203 | - threadPool: HappyThreadPool | ||
| 204 | - }), | ||
| 205 | ], | 198 | ], |
| 206 | output: { | 199 | output: { |
| 207 | filename: '[name].js', | 200 | filename: '[name].js', |
| 208 | - libraryTarget: 'commonjs2', | 201 | + libraryTarget: IsWeb ? 'var' : 'commonjs2', |
| 209 | - path: path.join(__dirname, '../dist/electron') | 202 | + path: IsWeb ? path.join(__dirname, '../dist/web') : path.join(__dirname, '../dist/electron') |
| 210 | }, | 203 | }, |
| 211 | resolve: { | 204 | resolve: { |
| 212 | alias: { | 205 | alias: { |
| ... | @@ -221,7 +214,7 @@ let rendererConfig = { | ... | @@ -221,7 +214,7 @@ let rendererConfig = { |
| 221 | /** | 214 | /** |
| 222 | * Adjust rendererConfig for development settings | 215 | * Adjust rendererConfig for development settings |
| 223 | */ | 216 | */ |
| 224 | -if (process.env.NODE_ENV !== 'production') { | 217 | +if (process.env.NODE_ENV !== 'production' && !IsWeb) { |
| 225 | rendererConfig.plugins.push( | 218 | rendererConfig.plugins.push( |
| 226 | new webpack.DefinePlugin({ | 219 | new webpack.DefinePlugin({ |
| 227 | '__static': `"${path.join(__dirname, '../static').replace(/\\/g, '\\\\')}"`, | 220 | '__static': `"${path.join(__dirname, '../static').replace(/\\/g, '\\\\')}"`, |
| ... | @@ -282,6 +275,31 @@ if (process.env.NODE_ENV === 'production') { | ... | @@ -282,6 +275,31 @@ if (process.env.NODE_ENV === 'production') { |
| 282 | } | 275 | } |
| 283 | })] | 276 | })] |
| 284 | } | 277 | } |
| 278 | + if (IsWeb) { | ||
| 279 | + rendererConfig.optimization.splitChunks = { | ||
| 280 | + chunks: "async", | ||
| 281 | + cacheGroups: { | ||
| 282 | + vendor: { // 将第三方模块提取出来 | ||
| 283 | + minSize: 30000, | ||
| 284 | + minChunks: 1, | ||
| 285 | + test: /node_modules/, | ||
| 286 | + chunks: 'initial', | ||
| 287 | + name: 'vendor', | ||
| 288 | + priority: 1 | ||
| 289 | + }, | ||
| 290 | + commons: { | ||
| 291 | + test: /[\\/]src[\\/]common[\\/]/, | ||
| 292 | + name: 'commons', | ||
| 293 | + minSize: 30000, | ||
| 294 | + minChunks: 3, | ||
| 295 | + chunks: 'initial', | ||
| 296 | + priority: -1, | ||
| 297 | + reuseExistingChunk: true // 这个配置允许我们使用已经存在的代码块 | ||
| 298 | + } | ||
| 299 | + } | ||
| 300 | + } | ||
| 301 | + rendererConfig.optimization.runtimeChunk = { name: 'runtime' } | ||
| 302 | + } | ||
| 285 | } | 303 | } |
| 286 | 304 | ||
| 287 | module.exports = rendererConfig | 305 | module.exports = rendererConfig | ... | ... |
-
请 注册 或 登录 后发表评论