Skip to content

Commit fbe428a

Browse files
mike1808mike1808
authored
Refactor code to use ES2015, Webpack 4 API (#6)
- remove usage of compilation.getStats() - rewrite in class syntax - update @babel and other deps - add webpack v4 to peer deps - add tests - update example - add prettier
1 parent c630e1b commit fbe428a

32 files changed

+10181
-4827
lines changed

‎.eslintrc.js

Lines changed: 13 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,14 @@
11
module.exports = {
2-
"env": {
3-
"browser": true,
4-
"commonjs": true,
5-
"es6": true
6-
},
7-
"extends": "eslint:recommended",
8-
"rules": {
9-
"indent": [
10-
"error",
11-
4
12-
],
13-
"linebreak-style": [
14-
"error",
15-
"unix"
16-
],
17-
"quotes": [
18-
"error",
19-
"single"
20-
],
21-
"semi": [
22-
"error",
23-
"always"
24-
]
25-
}
26-
};
2+
env: {
3+
browser: true,
4+
commonjs: true,
5+
es6: true,
6+
},
7+
extends: 'eslint:recommended',
8+
rules: {
9+
indent: ['error', 2],
10+
'linebreak-style': ['error', 'unix'],
11+
quotes: ['error', 'single'],
12+
semi: ['error', 'always'],
13+
},
14+
};

‎.prettierrc

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{
2+
"tabWidth": 2,
3+
"semi": true,
4+
"singleQuote": true,
5+
"trailingComma": "es5",
6+
"arrowParens": "avoid"
7+
}

‎README.md

Lines changed: 14 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
# css-chunks-html-webpack-plugin
2+
23
Plugin for injecting css chunks, extracted using extract-css-chunks-webpack-plugin, to HTML for html-webpack-plugin
34

45
Use in conjunction with
@@ -20,34 +21,29 @@ npm install --save-dev css-chunks-html-webpack-plugin@0.1.0
2021

2122
```bash
2223
npm install --save-dev css-chunks-html-webpack-plugin \
23-
extract-css-chunks-webpack-plugin babel-plugin-dual-import \
24+
mini-css-extract-plugin babel-plugin-dual-import \
2425
html-webpack-plugin
2526
```
2627

27-
*webpack.config.js*
28-
```js
29-
const ExtractCssChunks = require('extract-css-chunks-webpack-plugin');
30-
const HtmlWebpackPlugin = require('html-webpack-plugin');
31-
const CssChunksHtmlPlugin = require('css-chunks-html-webpack-plugin');
32-
33-
34-
module.exports = {
35-
// your other options
36-
plugins: [
37-
new ExtractCssChunks(),
38-
new CssChunksHtmlPlugin({ inject: 'head' }),
39-
new HtmlWebpackPlugin(),
40-
]
41-
};
28+
_webpack.config.js_
4229

30+
```js
31+
const ExtractCssPlugin = require('mini-css-extract-plugin');
32+
const HtmlWebpackPlugin = require('html-webpack-plugin');
33+
const CssChunksHtmlPlugin = require('css-chunks-html-webpack-plugin');
34+
35+
module.exports = {
36+
// your other options
37+
plugins: [new ExtractCssPlugin(), new CssChunksHtmlPlugin({ inject: 'head' }), new HtmlWebpackPlugin()],
38+
};
4339
```
4440

4541
## Configuration
4642

4743
You can pass an object of configuration options to CssChunkHashPlugin. Allowed values are as follows:
4844

4945
* `inject`: `'head'` | `'body'` | `false` whether to inject chunks paths script into HTML, used for manually adding
50-
chunks paths using custom template for HtmlWebpackPlugin (default `true`)
46+
chunks paths using custom template for HtmlWebpackPlugin (default `true`)
5147

5248
The CSS chunks paths map is saved in `htmlWebpackPlugin.files.cssHash` in your template. So if you want to manually add
5349
CSS chunks map you can do (if you are using EJS):
@@ -59,7 +55,7 @@ CSS chunks map you can do (if you are using EJS):
5955
```
6056

6157
By default, it will inject script tag into `<head>`. If you want to inject the script tag with `window.__CSS_CHUNKS__`
62-
into `<body>` set `inject: 'body'`,
58+
into `<body>` set `inject: 'body'`,
6359

6460
## Example
6561

‎examples/d.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
11
.d {
2-
color: gold;
2+
color: gold !important;
33
}

‎examples/dist/0.f5ed473c5f50a4f04b94.js

Lines changed: 0 additions & 29 deletions
This file was deleted.

‎examples/dist/1.824e5b18c4b57fab2f79.js

Lines changed: 0 additions & 29 deletions
This file was deleted.

‎examples/dist/2.f26b0f1f2fd32b696fd3.js

Lines changed: 0 additions & 29 deletions
This file was deleted.

‎examples/dist/a.17dc509483651237e80a.js

Lines changed: 0 additions & 1 deletion
This file was deleted.

‎examples/dist/a.2de6d07c0b145266b47da1fee4ba9e64.css

Lines changed: 0 additions & 3 deletions
This file was deleted.

0 commit comments

Comments
 (0)