Add compression

This commit is contained in:
Paulo Gustavo Veiga 2021-02-16 01:15:04 -08:00
parent 8efc8c283d
commit d1ff38fdca
6 changed files with 32 additions and 15 deletions

View File

@ -15,15 +15,12 @@
"license": "MIT", "license": "MIT",
"private": false, "private": false,
"devDependencies": { "devDependencies": {
"@babel/preset-env": "^7.12.7",
"@babel/preset-react": "^7.12.7",
"@formatjs/cli": "^2.13.15", "@formatjs/cli": "^2.13.15",
"@typescript-eslint/eslint-plugin": "^4.8.1", "@typescript-eslint/eslint-plugin": "^4.8.1",
"@typescript-eslint/parser": "^4.8.1", "@typescript-eslint/parser": "^4.8.1",
"babel-loader": "^8.2.2",
"babel-plugin-transform-imports": "^2.0.0",
"brotli-webpack-plugin": "^1.1.0", "brotli-webpack-plugin": "^1.1.0",
"clean-webpack-plugin": "^3.0.0", "clean-webpack-plugin": "^3.0.0",
"compression-webpack-plugin": "^7.1.2",
"copy-webpack-plugin": "^7.0.0", "copy-webpack-plugin": "^7.0.0",
"css-loader": "^5.0.1", "css-loader": "^5.0.1",
"eslint": "^7.14.0", "eslint": "^7.14.0",

View File

@ -1,4 +1,4 @@
import { FormControl, FormControlLabel, FormGroup, FormHelperText, FormLabel, Switch } from "@material-ui/core"; import { FormControl, FormControlLabel, FormGroup, Switch } from "@material-ui/core";
import React, { useEffect } from "react"; import React, { useEffect } from "react";
import { FormattedMessage, useIntl } from "react-intl"; import { FormattedMessage, useIntl } from "react-intl";
import { useMutation, useQueryClient } from "react-query"; import { useMutation, useQueryClient } from "react-query";

View File

@ -4,7 +4,7 @@
"sourceMap": true, "sourceMap": true,
"noImplicitAny": false, "noImplicitAny": false,
"module": "commonjs", "module": "commonjs",
"target": "es5", "target": "es6",
"jsx": "react", "jsx": "react",
"allowJs": true, "allowJs": true,
"esModuleInterop": true "esModuleInterop": true

View File

@ -1,7 +1,7 @@
const path = require('path'); const path = require('path');
const { CleanWebpackPlugin } = require('clean-webpack-plugin'); const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const CopyWebpackPlugin = require('copy-webpack-plugin'); const CopyWebpackPlugin = require('copy-webpack-plugin');
const CompressionPlugin = require('compression-webpack-plugin');
module.exports = { module.exports = {
@ -29,10 +29,6 @@ module.exports = {
}, },
] ]
}, },
output: {
filename: 'bundle.js',
path: path.resolve(__dirname, 'dist')
},
plugins: [ plugins: [
new CleanWebpackPlugin(), new CleanWebpackPlugin(),
new CopyWebpackPlugin({ new CopyWebpackPlugin({
@ -45,7 +41,7 @@ module.exports = {
] ]
} }
}] }]
}) }),
new CompressionPlugin()
] ]
} }

View File

@ -17,6 +17,10 @@ module.exports = merge(common, {
] ]
} }
}, },
output: {
filename: 'bundle.js',
path: path.resolve(__dirname, 'dist')
},
plugins: [ plugins: [
new HtmlWebpackPlugin({ new HtmlWebpackPlugin({
template: path.join(__dirname, 'public/index.html'), template: path.join(__dirname, 'public/index.html'),

View File

@ -1,11 +1,31 @@
const { merge } = require('webpack-merge'); const { merge } = require('webpack-merge');
const common = require('./webpack.common.js'); const common = require('./webpack.common.js');
const path = require('path');
module.exports = merge(common, { module.exports = merge(common, {
mode: 'production', mode: 'production',
devtool: 'source-map', devtool: 'source-map',
output: {
filename: '[name].bundle.js',
path: path.resolve(__dirname, 'dist')
},
optimization: { optimization: {
minimize: true, minimize: true,
usedExports: true usedExports: true,
}, splitChunks: {
cacheGroups: {
vendors: {
test: /node_modules\/(?!antd\/).*/,
name: "vendors",
chunks: "all",
},
// This can be your own design library.
antd: {
test: /node_modules\/(antd\/).*/,
name: "antd",
chunks: "all",
},
},
}
}
}); });