build: optimise production builds, automate creating zip files

This commit is contained in:
David Ralph
2021-06-22 21:07:56 +01:00
parent 50353c9e49
commit 5d3418a8af
3 changed files with 47 additions and 28 deletions

1
.gitignore vendored
View File

@@ -2,6 +2,7 @@
node_modules/ node_modules/
.vscode/ .vscode/
build/ build/
dist/
# Files # Files
package-lock.json package-lock.json

View File

@@ -48,13 +48,15 @@
"webpack": "^5.39.1", "webpack": "^5.39.1",
"webpack-cli": "^4.7.2", "webpack-cli": "^4.7.2",
"webpack-dev-server": "^3.11.2", "webpack-dev-server": "^3.11.2",
"webpack-merge": "^5.8.0" "webpack-merge": "^5.8.0",
"zip-file-webpack-plugin": "^1.2.0"
}, },
"scripts": { "scripts": {
"start": "webpack serve --config webpack.dev.js", "start": "webpack serve --config webpack.dev.js",
"build": "webpack --config webpack.prod.js", "build": "webpack --config webpack.prod.js",
"chrome": "cp manifest/chrome.json build/manifest.json", "build:chrome": "webpack --config webpack.prod.js --env=type=chrome",
"firefox": "cp manifest/firefox.json build/manifest.json" "build:firefox": "webpack --config webpack.prod.js --env=type=firefox",
"postinstall": "node -e \"if (require('fs').existsSync('node_modules/.cache/webpack')) require('fs').rmSync('node_modules/.cache/webpack', { recursive: true })\""
}, },
"browserslist": { "browserslist": {
"production": [ "production": [

View File

@@ -3,8 +3,12 @@ const common = require('./webpack.common.js');
const path = require('path'); const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin'); const HtmlWebpackPlugin = require('html-webpack-plugin');
const CopyPlugin = require('copy-webpack-plugin'); const CopyPlugin = require('copy-webpack-plugin');
const ZipFilePlugin = require('zip-file-webpack-plugin');
module.exports = merge(common, { module.exports = (env) => {
const type = env.type || 'web';
return merge(common, {
mode: 'production', mode: 'production',
output: { output: {
path: path.resolve(__dirname, './build'), path: path.resolve(__dirname, './build'),
@@ -12,6 +16,9 @@ module.exports = merge(common, {
chunkFilename: '[id].[chunkhash].chunk.js', chunkFilename: '[id].[chunkhash].chunk.js',
clean: true clean: true
}, },
cache: {
type: 'filesystem'
},
plugins: [ plugins: [
new HtmlWebpackPlugin({ new HtmlWebpackPlugin({
template: path.resolve(__dirname, './public/index.html') template: path.resolve(__dirname, './public/index.html')
@@ -24,8 +31,17 @@ module.exports = merge(common, {
{ {
from: 'public/offline-images', from: 'public/offline-images',
to: 'offline-images' to: 'offline-images'
},
{
from: `manifest/${type}.json`,
to: 'manifest.json'
} }
] ]
}),
new ZipFilePlugin({
path: '../dist/',
filename: `${type}.zip`
}) })
] ]
}); });
}