chore: Bundle Stats / Webpack v4 (#1448)
* chore: Experiment with bundle size monitoring service * chore: Ensure build runs on CI, move lint and flow before test * chore: Upgrade Webpack v3 -> v4 * chore: Add webpack-cli Remove unused dep Move deps to dev * Move babel deps to production * Move babel deps to production
This commit is contained in:
Tom Moor
GitHub
parent
0f41a04e49
commit
11f7e3a060
|
|
@ -29,12 +29,15 @@ jobs:
|
|||
- run:
|
||||
name: migrate
|
||||
command: ./node_modules/.bin/sequelize db:migrate --url $DATABASE_URL_TEST
|
||||
- run:
|
||||
name: test
|
||||
command: yarn test
|
||||
- run:
|
||||
name: lint
|
||||
command: yarn lint
|
||||
- run:
|
||||
name: flow
|
||||
command: yarn flow check --max-workers 4
|
||||
command: yarn flow check --max-workers 4
|
||||
- run:
|
||||
name: test
|
||||
command: yarn test
|
||||
- run:
|
||||
name: build
|
||||
command: yarn build
|
||||
|
|
@ -1,119 +0,0 @@
|
|||
// flow-typed signature: d828559e8abc3863ee0f8ef88f5b646e
|
||||
// flow-typed version: <<STUB>>/identity-obj-proxy_v^3.0.0/flow_v0.104.0
|
||||
|
||||
/**
|
||||
* This is an autogenerated libdef stub for:
|
||||
*
|
||||
* 'identity-obj-proxy'
|
||||
*
|
||||
* Fill this stub out by replacing all the `any` types.
|
||||
*
|
||||
* Once filled out, we encourage you to share your work with the
|
||||
* community by sending a pull request to:
|
||||
* https://github.com/flowtype/flow-typed
|
||||
*/
|
||||
|
||||
declare module 'identity-obj-proxy' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
|
||||
/**
|
||||
* We include stubs for each file inside this npm package in case you need to
|
||||
* require those files directly. Feel free to delete any files that aren't
|
||||
* needed.
|
||||
*/
|
||||
declare module 'identity-obj-proxy/src/__tests__/import-es6-export-test' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
|
||||
declare module 'identity-obj-proxy/src/__tests__/import-es6-import-export-test' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
|
||||
declare module 'identity-obj-proxy/src/__tests__/import-es6-import-test' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
|
||||
declare module 'identity-obj-proxy/src/__tests__/import-vanilla-test' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
|
||||
declare module 'identity-obj-proxy/src/__tests__/index-test' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
|
||||
declare module 'identity-obj-proxy/src/__tests__/require-es6-export-test' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
|
||||
declare module 'identity-obj-proxy/src/__tests__/require-es6-import-export-test' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
|
||||
declare module 'identity-obj-proxy/src/__tests__/require-es6-import-test' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
|
||||
declare module 'identity-obj-proxy/src/__tests__/require-vanilla-test' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
|
||||
declare module 'identity-obj-proxy/src' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
|
||||
declare module 'identity-obj-proxy/src/test-redirections/idObjES6Export' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
|
||||
declare module 'identity-obj-proxy/src/test-redirections/idObjES6Import' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
|
||||
declare module 'identity-obj-proxy/src/test-redirections/idObjES6ImportExport' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
|
||||
// Filename aliases
|
||||
declare module 'identity-obj-proxy/src/__tests__/import-es6-export-test.js' {
|
||||
declare module.exports: $Exports<'identity-obj-proxy/src/__tests__/import-es6-export-test'>;
|
||||
}
|
||||
declare module 'identity-obj-proxy/src/__tests__/import-es6-import-export-test.js' {
|
||||
declare module.exports: $Exports<'identity-obj-proxy/src/__tests__/import-es6-import-export-test'>;
|
||||
}
|
||||
declare module 'identity-obj-proxy/src/__tests__/import-es6-import-test.js' {
|
||||
declare module.exports: $Exports<'identity-obj-proxy/src/__tests__/import-es6-import-test'>;
|
||||
}
|
||||
declare module 'identity-obj-proxy/src/__tests__/import-vanilla-test.js' {
|
||||
declare module.exports: $Exports<'identity-obj-proxy/src/__tests__/import-vanilla-test'>;
|
||||
}
|
||||
declare module 'identity-obj-proxy/src/__tests__/index-test.js' {
|
||||
declare module.exports: $Exports<'identity-obj-proxy/src/__tests__/index-test'>;
|
||||
}
|
||||
declare module 'identity-obj-proxy/src/__tests__/require-es6-export-test.js' {
|
||||
declare module.exports: $Exports<'identity-obj-proxy/src/__tests__/require-es6-export-test'>;
|
||||
}
|
||||
declare module 'identity-obj-proxy/src/__tests__/require-es6-import-export-test.js' {
|
||||
declare module.exports: $Exports<'identity-obj-proxy/src/__tests__/require-es6-import-export-test'>;
|
||||
}
|
||||
declare module 'identity-obj-proxy/src/__tests__/require-es6-import-test.js' {
|
||||
declare module.exports: $Exports<'identity-obj-proxy/src/__tests__/require-es6-import-test'>;
|
||||
}
|
||||
declare module 'identity-obj-proxy/src/__tests__/require-vanilla-test.js' {
|
||||
declare module.exports: $Exports<'identity-obj-proxy/src/__tests__/require-vanilla-test'>;
|
||||
}
|
||||
declare module 'identity-obj-proxy/src/index' {
|
||||
declare module.exports: $Exports<'identity-obj-proxy/src'>;
|
||||
}
|
||||
declare module 'identity-obj-proxy/src/index.js' {
|
||||
declare module.exports: $Exports<'identity-obj-proxy/src'>;
|
||||
}
|
||||
declare module 'identity-obj-proxy/src/test-redirections/idObjES6Export.js' {
|
||||
declare module.exports: $Exports<'identity-obj-proxy/src/test-redirections/idObjES6Export'>;
|
||||
}
|
||||
declare module 'identity-obj-proxy/src/test-redirections/idObjES6Import.js' {
|
||||
declare module.exports: $Exports<'identity-obj-proxy/src/test-redirections/idObjES6Import'>;
|
||||
}
|
||||
declare module 'identity-obj-proxy/src/test-redirections/idObjES6ImportExport.js' {
|
||||
declare module.exports: $Exports<'identity-obj-proxy/src/test-redirections/idObjES6ImportExport'>;
|
||||
}
|
||||
|
|
@ -1,83 +0,0 @@
|
|||
// flow-typed signature: 90824cfc39ff764d3f06f9f71bdb6ef1
|
||||
// flow-typed version: <<STUB>>/uglifyjs-webpack-plugin_v1.2.5/flow_v0.104.0
|
||||
|
||||
/**
|
||||
* This is an autogenerated libdef stub for:
|
||||
*
|
||||
* 'uglifyjs-webpack-plugin'
|
||||
*
|
||||
* Fill this stub out by replacing all the `any` types.
|
||||
*
|
||||
* Once filled out, we encourage you to share your work with the
|
||||
* community by sending a pull request to:
|
||||
* https://github.com/flowtype/flow-typed
|
||||
*/
|
||||
|
||||
declare module 'uglifyjs-webpack-plugin' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
|
||||
/**
|
||||
* We include stubs for each file inside this npm package in case you need to
|
||||
* require those files directly. Feel free to delete any files that aren't
|
||||
* needed.
|
||||
*/
|
||||
declare module 'uglifyjs-webpack-plugin/dist/cjs' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
|
||||
declare module 'uglifyjs-webpack-plugin/dist' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
|
||||
declare module 'uglifyjs-webpack-plugin/dist/uglify' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
|
||||
declare module 'uglifyjs-webpack-plugin/dist/uglify/minify' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
|
||||
declare module 'uglifyjs-webpack-plugin/dist/uglify/versions' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
|
||||
declare module 'uglifyjs-webpack-plugin/dist/uglify/worker' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
|
||||
declare module 'uglifyjs-webpack-plugin/dist/utils' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
|
||||
// Filename aliases
|
||||
declare module 'uglifyjs-webpack-plugin/dist/cjs.js' {
|
||||
declare module.exports: $Exports<'uglifyjs-webpack-plugin/dist/cjs'>;
|
||||
}
|
||||
declare module 'uglifyjs-webpack-plugin/dist/index' {
|
||||
declare module.exports: $Exports<'uglifyjs-webpack-plugin/dist'>;
|
||||
}
|
||||
declare module 'uglifyjs-webpack-plugin/dist/index.js' {
|
||||
declare module.exports: $Exports<'uglifyjs-webpack-plugin/dist'>;
|
||||
}
|
||||
declare module 'uglifyjs-webpack-plugin/dist/uglify/index' {
|
||||
declare module.exports: $Exports<'uglifyjs-webpack-plugin/dist/uglify'>;
|
||||
}
|
||||
declare module 'uglifyjs-webpack-plugin/dist/uglify/index.js' {
|
||||
declare module.exports: $Exports<'uglifyjs-webpack-plugin/dist/uglify'>;
|
||||
}
|
||||
declare module 'uglifyjs-webpack-plugin/dist/uglify/minify.js' {
|
||||
declare module.exports: $Exports<'uglifyjs-webpack-plugin/dist/uglify/minify'>;
|
||||
}
|
||||
declare module 'uglifyjs-webpack-plugin/dist/uglify/versions.js' {
|
||||
declare module.exports: $Exports<'uglifyjs-webpack-plugin/dist/uglify/versions'>;
|
||||
}
|
||||
declare module 'uglifyjs-webpack-plugin/dist/uglify/worker.js' {
|
||||
declare module.exports: $Exports<'uglifyjs-webpack-plugin/dist/uglify/worker'>;
|
||||
}
|
||||
declare module 'uglifyjs-webpack-plugin/dist/utils/index' {
|
||||
declare module.exports: $Exports<'uglifyjs-webpack-plugin/dist/utils'>;
|
||||
}
|
||||
declare module 'uglifyjs-webpack-plugin/dist/utils/index.js' {
|
||||
declare module.exports: $Exports<'uglifyjs-webpack-plugin/dist/utils'>;
|
||||
}
|
||||
38
package.json
38
package.json
|
|
@ -56,6 +56,13 @@
|
|||
},
|
||||
"browserslist": "> 0.25%, not dead",
|
||||
"dependencies": {
|
||||
"@babel/core": "^7.11.1",
|
||||
"@babel/plugin-proposal-decorators": "^7.10.5",
|
||||
"@babel/plugin-transform-destructuring": "^7.10.4",
|
||||
"@babel/plugin-transform-regenerator": "^7.10.4",
|
||||
"@babel/preset-env": "^7.11.0",
|
||||
"@babel/preset-flow": "^7.10.4",
|
||||
"@babel/preset-react": "^7.10.4",
|
||||
"@babel/polyfill": "^7.10.4",
|
||||
"@babel/register": "^7.10.5",
|
||||
"@rehooks/window-scroll-position": "^1.0.1",
|
||||
|
|
@ -64,6 +71,9 @@
|
|||
"@tommoor/remove-markdown": "0.3.1",
|
||||
"autotrack": "^2.4.1",
|
||||
"aws-sdk": "^2.135.0",
|
||||
"babel-plugin-lodash": "^3.3.4",
|
||||
"babel-plugin-styled-components": "^1.11.1",
|
||||
"babel-plugin-transform-class-properties": "^6.24.1",
|
||||
"boundless-arrow-key-navigation": "^1.0.4",
|
||||
"boundless-popover": "^1.0.4",
|
||||
"bull": "^3.5.2",
|
||||
|
|
@ -80,7 +90,6 @@
|
|||
"flow-typed": "^2.6.2",
|
||||
"fs-extra": "^4.0.2",
|
||||
"google-auth-library": "^5.5.1",
|
||||
"html-webpack-plugin": "3.2.0",
|
||||
"http-errors": "1.4.0",
|
||||
"immutable": "^3.8.2",
|
||||
"imports-loader": "0.6.5",
|
||||
|
|
@ -146,27 +155,14 @@
|
|||
"styled-normalize": "^8.0.4",
|
||||
"tiny-cookie": "^2.3.1",
|
||||
"tmp": "0.0.33",
|
||||
"uglifyjs-webpack-plugin": "1.2.5",
|
||||
"url-loader": "^0.6.2",
|
||||
"uuid": "2.0.2",
|
||||
"validator": "5.2.0",
|
||||
"webpack": "3.10.0",
|
||||
"webpack-manifest-plugin": "^1.3.2"
|
||||
"validator": "5.2.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.11.1",
|
||||
"@babel/plugin-proposal-decorators": "^7.10.5",
|
||||
"@babel/plugin-transform-destructuring": "^7.10.4",
|
||||
"@babel/plugin-transform-regenerator": "^7.10.4",
|
||||
"@babel/preset-env": "^7.11.0",
|
||||
"@babel/preset-flow": "^7.10.4",
|
||||
"@babel/preset-react": "^7.10.4",
|
||||
"@relative-ci/agent": "^1.3.0",
|
||||
"babel-eslint": "^10.1.0",
|
||||
"babel-jest": "^26.2.2",
|
||||
"babel-loader": "^8.1.0",
|
||||
"babel-plugin-lodash": "^3.3.4",
|
||||
"babel-plugin-styled-components": "^1.11.1",
|
||||
"babel-plugin-transform-class-properties": "^6.24.1",
|
||||
"eslint": "^7.6.0",
|
||||
"eslint-config-react-app": "3.0.6",
|
||||
"eslint-plugin-flowtype": "^5.2.0",
|
||||
|
|
@ -176,18 +172,22 @@
|
|||
"eslint-plugin-react": "^7.20.0",
|
||||
"fetch-test-server": "^1.1.0",
|
||||
"flow-bin": "^0.104.0",
|
||||
"identity-obj-proxy": "^3.0.0",
|
||||
"html-webpack-plugin": "3.2.0",
|
||||
"jest-cli": "^26.0.0",
|
||||
"koa-webpack-dev-middleware": "^1.4.5",
|
||||
"koa-webpack-hot-middleware": "^1.0.3",
|
||||
"mobx-react-devtools": "^6.0.3",
|
||||
"nodemon": "^1.19.4",
|
||||
"prettier": "^2.0.5",
|
||||
"rimraf": "^2.5.4"
|
||||
"rimraf": "^2.5.4",
|
||||
"url-loader": "^0.6.2",
|
||||
"webpack": "4.44.1",
|
||||
"webpack-cli": "^3.3.12",
|
||||
"webpack-manifest-plugin": "^2.2.0"
|
||||
},
|
||||
"resolutions": {
|
||||
"dot-prop": "^5.2.0",
|
||||
"js-yaml": "^3.13.1"
|
||||
},
|
||||
"version": "0.45.0"
|
||||
}
|
||||
}
|
||||
|
|
@ -4,6 +4,7 @@ const commonWebpackConfig = require("./webpack.config");
|
|||
|
||||
const developmentWebpackConfig = Object.assign(commonWebpackConfig, {
|
||||
cache: true,
|
||||
mode: "development",
|
||||
devtool: "eval-source-map",
|
||||
entry: [
|
||||
"webpack-hot-middleware/client",
|
||||
|
|
@ -13,10 +14,7 @@ const developmentWebpackConfig = Object.assign(commonWebpackConfig, {
|
|||
|
||||
developmentWebpackConfig.plugins = [
|
||||
...developmentWebpackConfig.plugins,
|
||||
new webpack.HotModuleReplacementPlugin(),
|
||||
new webpack.DefinePlugin({
|
||||
"process.env.NODE_ENV": JSON.stringify("development"),
|
||||
}),
|
||||
new webpack.HotModuleReplacementPlugin()
|
||||
];
|
||||
|
||||
module.exports = developmentWebpackConfig;
|
||||
|
|
|
|||
|
|
@ -2,6 +2,7 @@
|
|||
const path = require('path');
|
||||
const webpack = require('webpack');
|
||||
const HtmlWebpackPlugin = require('html-webpack-plugin');
|
||||
const { RelativeCiAgentWebpackPlugin } = require('@relative-ci/agent');
|
||||
|
||||
require('dotenv').config({ silent: true });
|
||||
|
||||
|
|
@ -27,7 +28,6 @@ module.exports = {
|
|||
cacheDirectory: true
|
||||
}
|
||||
},
|
||||
{ test: /\.json$/, loader: 'json-loader' },
|
||||
// inline base64 URLs for <=8k images, direct URLs for the rest
|
||||
{ test: /\.(png|jpg|svg)$/, loader: 'url-loader' },
|
||||
{
|
||||
|
|
@ -55,6 +55,7 @@ module.exports = {
|
|||
new HtmlWebpackPlugin({
|
||||
template: 'server/static/index.html',
|
||||
}),
|
||||
new RelativeCiAgentWebpackPlugin(),
|
||||
],
|
||||
stats: {
|
||||
assets: false,
|
||||
|
|
|
|||
|
|
@ -1,13 +1,13 @@
|
|||
/* eslint-disable */
|
||||
const path = require('path');
|
||||
const webpack = require('webpack');
|
||||
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
|
||||
const ManifestPlugin = require('webpack-manifest-plugin');
|
||||
|
||||
commonWebpackConfig = require('./webpack.config');
|
||||
|
||||
productionWebpackConfig = Object.assign(commonWebpackConfig, {
|
||||
cache: true,
|
||||
mode: "production",
|
||||
devtool: 'source-map',
|
||||
entry: ['./app/index'],
|
||||
output: {
|
||||
|
|
@ -19,17 +19,7 @@ productionWebpackConfig = Object.assign(commonWebpackConfig, {
|
|||
});
|
||||
productionWebpackConfig.plugins = [
|
||||
...productionWebpackConfig.plugins,
|
||||
new ManifestPlugin(),
|
||||
new UglifyJsPlugin({
|
||||
sourceMap: true,
|
||||
uglifyOptions: {
|
||||
compress: true,
|
||||
keep_fnames: true
|
||||
}
|
||||
}),
|
||||
new webpack.DefinePlugin({
|
||||
'process.env.NODE_ENV': JSON.stringify('production'),
|
||||
}),
|
||||
new ManifestPlugin()
|
||||
];
|
||||
|
||||
module.exports = productionWebpackConfig;
|
||||
|
|
|
|||
Reference in New Issue