muerwre/orchidmap-front
1
0
Fork 0
mirror of https://github.com/muerwre/orchidmap-front.git synced 2025-04-25 02:56:41 +07:00
Code Issues Projects Releases Packages Wiki Activity Actions

better webpack optimization

Browse source
This commit is contained in:
muerwre 2019-03-08 10:48:03 +07:00
parent 14ed2d2893
commit acfd5138df
3 changed files with 1172 additions and 95 deletions
Download patch file Download diff file Expand all files Collapse all files

1220
package-lock.json generated
View file

File diff suppressed because it is too large Load diff

10
package.json
View file

@ -15,9 +15,9 @@
"license": "ISC", "license": "ISC",
"keywords": [], "keywords": [],
"devDependencies": { "devDependencies": {
"awesome-typescript-loader": "^5.2.1",
"@babel/cli": "^7.0.0-rc.1", "@babel/cli": "^7.0.0-rc.1",
"@babel/preset-env": "^7.0.0-rc.1", "@babel/preset-env": "^7.0.0-rc.1",
"awesome-typescript-loader": "^5.2.1",
"babel-core": "^6.26.0", "babel-core": "^6.26.0",
"babel-eslint": "^8.2.3", "babel-eslint": "^8.2.3",
"babel-loader": "^7.1.4", "babel-loader": "^7.1.4",
@ -42,13 +42,14 @@
"html-webpack-plugin": "^3.2.0", "html-webpack-plugin": "^3.2.0",
"identity-obj-proxy": "^3.0.0", "identity-obj-proxy": "^3.0.0",
"less-loader": "^4.1.0", "less-loader": "^4.1.0",
"mini-css-extract-plugin": "^0.5.0",
"style-loader": "^0.21.0", "style-loader": "^0.21.0",
"ts-node": "^8.0.1",
"typescript": "^3.2.4",
"uglifyjs-webpack-plugin": "^1.3.0", "uglifyjs-webpack-plugin": "^1.3.0",
"webpack": "^4.6.0", "webpack": "^4.6.0",
"webpack-cli": "^3.2.3", "webpack-cli": "^3.2.3",
"webpack-dev-server": "^3.1.14", "webpack-dev-server": "^3.1.14"
"ts-node": "^8.0.1",
"typescript": "^3.2.4"
}, },
"dependencies": { "dependencies": {
"@types/classnames": "^2.2.7", "@types/classnames": "^2.2.7",
@ -81,6 +82,7 @@
"mongoose": "^5.3.14", "mongoose": "^5.3.14",
"morgan": "~1.9.0", "morgan": "~1.9.0",
"mysql": "^2.16.0", "mysql": "^2.16.0",
"optimize-css-assets-webpack-plugin": "^5.0.1",
"pt-sans-cyrillic": "0.0.4", "pt-sans-cyrillic": "0.0.4",
"pug": "2.0.0-beta11", "pug": "2.0.0-beta11",
"raleway-cyrillic": "^4.0.2", "raleway-cyrillic": "^4.0.2",

37
webpack.config.js
View file

@ -2,15 +2,16 @@
const webpack = require('webpack'); const webpack = require('webpack');
const HtmlWebPackPlugin = require('html-webpack-plugin'); const HtmlWebPackPlugin = require('html-webpack-plugin');
// const FlowWebpackPlugin = require('flow-webpack-plugin'); // const FlowWebpackPlugin = require('flow-webpack-plugin');
const { version } = require('./package.json'); // const { version } = require('./package.json');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const WebpackGitHash = require('webpack-git-hash'); const UglifyJsPlugin = require("uglifyjs-webpack-plugin");
// const WebpackGitHash = require('webpack-git-hash');
const { join } = require('path'); const { join } = require('path');
const OptimizeCSSAssetsPlugin = require("optimize-css-assets-webpack-plugin");
/* Plugins */ /* Plugins */
const concatPlugin = new webpack.optimize.ModuleConcatenationPlugin(); // const concatPlugin = new webpack.optimize.ModuleConcatenationPlugin();
const htmlPlugin = new HtmlWebPackPlugin({ const htmlPlugin = new HtmlWebPackPlugin({
template: './src/index.html', template: './src/index.html',
filename: './index.html', filename: './index.html',
@ -19,12 +20,17 @@ const htmlPlugin = new HtmlWebPackPlugin({
favicon: 'src/sprites/favicon.png', favicon: 'src/sprites/favicon.png',
}); });
const miniCssExractPlugin = new MiniCssExtractPlugin({
filename: '[name].css',
chunkFilename: '[id].css'
});
const isDevelopment = process.env.NODE_ENV !== 'production'; const isDevelopment = process.env.NODE_ENV !== 'production';
const devtool = isDevelopment ? 'cheap-module-eval-source-map' : 'source-map'; const devtool = isDevelopment ? 'cheap-module-eval-source-map' : 'source-map';
// const flowPlugin = new FlowWebpackPlugin(); // const flowPlugin = new FlowWebpackPlugin();
const gitPlugin = new WebpackGitHash(); // const gitPlugin = new WebpackGitHash();
/* Resolve */ /* Resolve */
@ -52,8 +58,10 @@ module.exports = () => {
// concatPlugin, // concatPlugin,
htmlPlugin, htmlPlugin,
// flowPlugin, // flowPlugin,
gitPlugin, // gitPlugin,
new webpack.IgnorePlugin(/^osrm-text-instructions$/, /leaflet-routing-machine$/) new webpack.IgnorePlugin(/^osrm-text-instructions$/, /leaflet-routing-machine$/),
miniCssExractPlugin,
new webpack.HashedModuleIdsPlugin(),
]; ];
return { return {
@ -69,7 +77,8 @@ module.exports = () => {
{ {
test: /\.less$/, test: /\.less$/,
use: [ use: [
{ loader: 'style-loader' }, { loader: isDevelopment ? 'style-loader' : MiniCssExtractPlugin.loader },
// { loader: 'style-loader' },
{ loader: 'css-loader' }, { loader: 'css-loader' },
{ loader: 'less-loader' } { loader: 'less-loader' }
] ]
@ -109,7 +118,7 @@ module.exports = () => {
}, },
output: { output: {
publicPath: '/', publicPath: '/',
filename: '[name].bundle.[githash].js', filename: isDevelopment ? '[name].[hash].js' : '[name].[contenthash].js',
}, },
optimization: { optimization: {
splitChunks: { splitChunks: {
@ -137,6 +146,14 @@ module.exports = () => {
} }
} }
}, },
minimizer: [
new UglifyJsPlugin({
cache: true,
parallel: true,
sourceMap: true // set to true if you want JS source maps
}),
new OptimizeCSSAssetsPlugin({})
],
occurrenceOrder: true // To keep filename consistent between different modes (for example building only) occurrenceOrder: true // To keep filename consistent between different modes (for example building only)
}, },
devServer: { devServer: {