ayo/mnswpr
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

code splitting and optimizations

Browse source
This commit is contained in:
Ayo 2019-12-16 14:00:32 +08:00
parent e851e69bae
commit b3e64ed3dc
4 changed files with 1692 additions and 55 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
index.html
View file

@ -22,23 +22,23 @@
gtag('config', 'UA-113797180-1');
</script>
<link rel="shortcut icon" type="image/png" href="/favicon.ico">
<script type="module" src="/dist/vendors~main.bundle.js"></script>
<link rel="stylesheet" href="/dist/main.bundle.css" />
<link rel="shortcut icon" type="image/png" href="/favicon.ico" />
</head>
<body style="background: black; width: 100%; text-align: center; color: white">
<body>
<div id="body-wrapper">
<div id="app">
Please use Chrome or Firefox. Sorry for the inconvenience. Please buy me coffee.
Please use Chrome or Firefox.
<br />
<div class="lds-ellipsis"><div></div><div></div><div></div><div></div></div>
<br />
<br />
</div>
<script type='text/javascript' src='https://ko-fi.com/widgets/widget_2.js'></script><script type='text/javascript'>kofiwidget2.init('Buy me a coffee', '#29abe0', 'ayoayco');kofiwidget2.draw();</script>
</div>
<script type="module" src="/dist/main.js"></script>
<script type="module" src="/dist/main.bundle.js"></script>
</body>
</html>

1695
package-lock.json generated
View file

File diff suppressed because it is too large Load diff

5
package.json
View file

@ -7,7 +7,7 @@
"test": "echo \"Error: no test specified\" && exit 1",
"start": "http-server .",
"watch:dev": "node ./node_modules/webpack/bin/webpack.js --watch --mode development .",
"buildprod": "node ./node_modules/webpack/bin/webpack.js ."
"buildprod": "node ./node_modules/webpack/bin/webpack.js --mode production ."
},
"author": "",
"license": "ISC",
@ -18,7 +18,10 @@
"devDependencies": {
"css-loader": "^3.3.0",
"http-server": "^0.12.0",
"mini-css-extract-plugin": "^0.8.0",
"optimize-css-assets-webpack-plugin": "^5.0.3",
"style-loader": "^1.0.1",
"terser-webpack-plugin": "^2.3.0",
"webpack-cli": "^3.3.10"
}
}

35
webpack.config.js
View file

@ -1,9 +1,42 @@
const path = require('path');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const TerserJSPlugin = require('terser-webpack-plugin');
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
module.exports = {
entry: {
main: './src/index.js',
},
output: {
filename: '[name].bundle.js',
path: path.resolve(__dirname, 'dist'),
},
optimization: {
minimizer: [new TerserJSPlugin({}), new OptimizeCSSAssetsPlugin({})],
splitChunks: {
chunks: 'all',
},
},
plugins: [
new MiniCssExtractPlugin({
// Options similar to the same options in webpackOptions.output
// all options are optional
filename: '[name].bundle.css',
chunkFilename: '[id].css',
ignoreOrder: false, // Enable to remove warnings about conflicting order
}),
],
module: {
rules: [
{
test: /\.css$/i,
use:['style-loader','css-loader']
use: [
{
loader: MiniCssExtractPlugin.loader,
},
'css-loader',
],
},
],
},