Skip to content

Commit 7f57d3f

Browse files
webdiscuswebdiscus
committed
docs: update readme
1 parent ded1569 commit 7f57d3f

File tree

3 files changed

+100
-51
lines changed

3 files changed

+100
-51
lines changed

‎CHANGELOG.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,6 @@
1+
## 1.0.1 (2022-09-19)
2+
- docs: update readme
3+
14
## 1.0.0 (2022-09-12)
25
- BRAKING CHANGE: reverted defaults behavior as in `v0.8.1` - remove empty scripts before other plugins will be called.
36
This change is needs for properly work of the vast majority of webpack plugins.

‎README.md

Lines changed: 87 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -1,79 +1,68 @@
1-
[![npm](https://img.shields.io/npm/v/webpack-remove-empty-scripts/latest?logo=npm&color=brightgreen "npm package")](https://www.npmjs.com/package/webpack-remove-empty-scripts/v/0.8.3)
1+
<div align="center">
2+
<img width="120" height="120" src="https://cdn.worldvectorlogo.com/logos/logo-javascript.svg">
3+
<a href="https://webpack.js.org/">
4+
<img width="120" height="120" vspace="" hspace="25" src="https://cdn.rawgit.com/webpack/media/e7485eb2/logo/icon-square-big.svg">
5+
</a>
6+
<h1><a href="https://github.com/webdiscus/webpack-remove-empty-scripts">webpack-remove-empty-scripts</a></h1>
7+
<div>The plugin removes empty JavaScript files generated when using only styles in Webpack entry.</div>
8+
</div>
9+
10+
---
11+
[![npm](https://img.shields.io/npm/v/webpack-remove-empty-scripts/latest?logo=npm&color=brightgreen "npm package")](https://www.npmjs.com/package/webpack-remove-empty-scripts)
212
[![node](https://img.shields.io/node/v/webpack-remove-empty-scripts)](https://nodejs.org)
313
[![node](https://img.shields.io/github/package-json/dependency-version/webdiscus/webpack-remove-empty-scripts/peer/webpack)](https://webpack.js.org/)
414
[![codecov](https://codecov.io/gh/webdiscus/webpack-remove-empty-scripts/branch/master/graph/badge.svg)](https://codecov.io/gh/webdiscus/webpack-remove-empty-scripts)
515
[![node](https://img.shields.io/npm/dm/webpack-remove-empty-scripts)](https://www.npmjs.com/package/webpack-remove-empty-scripts)
616

7-
# [webpack-remove-empty-scripts](https://www.npmjs.com/package/webpack-remove-empty-scripts)
8-
9-
10-
The plugin removes empty `js` scripts generated when using only the styles like `css` `scss` `sass` `less` `stylus` in the webpack entry.
17+
Webpack generates a js file for each resource defined in Webpack entry.\
18+
The `mini-css-extract-plugin` extract CSS, but not eliminate a generated empty js file.\
19+
See the [mini-css-extract-plugin issue](https://github.com/webpack-contrib/mini-css-extract-plugin/issues/151).
20+
```js
21+
module.exports = {
22+
entry: {
23+
styles: './styles.scss', // generates expected `styles.css` and unexpected `styles.js`
24+
},
25+
}
26+
```
27+
This plugin remove unexpected empty js file.
1128

12-
This is improved fork of original plugin [webpack-fix-style-only-entries](https://github.com/fqborges/webpack-fix-style-only-entries) ver. 0.6.0.\
13-
This fork fixes deprecation messages, issues when using React and some specific plugins.
1429

15-
The plugin support only `Webpack 5`.
16-
For `Webpack 4` use original [plugin](https://github.com/fqborges/webpack-fix-style-only-entries).
30+
> **Note**
31+
>
32+
> This is improved fork of the plugin [webpack-fix-style-only-entries](https://github.com/fqborges/webpack-fix-style-only-entries) v0.6.0.\
33+
> The plugin support `Webpack 5` only.
34+
> For `Webpack 4` use original [plugin](https://github.com/fqborges/webpack-fix-style-only-entries).
1735
1836
> **Warning**
1937
>
2038
> The new version `1.0.0` has probable `BRAKING CHANGE`.\
2139
> In this version was reverted defaults behavior as in `v0.8.1` - remove empty scripts `before` processing other plugins.
22-
40+
>
2341
> **Migration to v1.0.0**
2442
>
2543
> When update from `<= v0.8.1`, nothing needs to be done.\
2644
> When update from `v0.8.2 - v0.8.4`, if you have an issue, try to use new `stage` option with `RemoveEmptyScriptsPlugin.STAGE_AFTER_PROCESS_PLUGINS` value.
2745
28-
## Description of the problem
29-
30-
Webpack generates a js file for each resource defined in a webpack entry.
31-
Some extract plugins use webpack entry to define non-js resources.
32-
For example, in webpack entry might be defined resources like js, css, scss, html, pug, etc.
33-
Each resource type needs its own extract plugin and loader. Such a extract plugin should take care of eliminating the phantom js files for non-js resources by self.
34-
But the `mini-css-extract-plugin` not do it.
35-
This plugin fixes this, finds and removes phantom js files for non-js resources.
36-
37-
```js
38-
module.exports = {
39-
entry: {
40-
main: './main.js', // the generated `main.js` is what we expect
41-
styles: './main.scss', // will be generated the expected `styles.css` and the unexpected `styles.js`
42-
},
43-
// ...
44-
}
45-
```
46-
47-
You can find more info by the following issues:
48-
49-
- [extract-text-webpack-plugin issue](https://github.com/webpack-contrib/extract-text-webpack-plugin/issues/518)
50-
- [mini-css-extract-plugin issue](https://github.com/webpack-contrib/mini-css-extract-plugin/issues/151)
51-
5246
---
5347

5448
## Usage with Pug
5549

5650
If you use Pug with this plugin, then you should use the [pug-plugin](https://github.com/webdiscus/pug-plugin).<br>
57-
Pug plugin enable using Pug files directly in webpack entry.<br>
58-
Pug plugin extract JavaScript and CSS from sources used in Pug.
59-
60-
> 💡Using `pug-plugin` the entry-point is the Pug template, not a JS file.
51+
Pug plugin enable to define Pug files in Webpack entry, extract JS and CSS from their sources used in Pug.
6152

62-
Define Pug files in webpack entry:
53+
Define Pug files in Webpack entry:
6354
```js
6455
const PugPlugin = require('pug-plugin');
6556
module.exports = {
6657
entry: {
6758
// all script and style sources can be defined directly in Pug
6859
index: './src/views/index.pug', // => dist/index.html
69-
about: './src/views/about/index.pug' // => dist/about.html
7060
},
7161
plugins: [
72-
// enable using Pug files in webpack entry
62+
// enable using Pug files in Webpack entry
7363
new PugPlugin({
7464
// extract CSS from style sources defined in Pug
7565
extractCss: {
76-
// output filename of styles
7766
filename: 'assets/css/[name].[contenthash:8].css',
7867
},
7968
}),
@@ -93,9 +82,7 @@ Generated HTML contains hashed CSS and JS output filenames:
9382
<script src="/assets/js/main.f4b855d8.js"></script>
9483
```
9584

96-
You don't need anymore to use `html-webpack-plugin` `mini-css-extract-plugin` `webpack-remove-empty-scripts` and `pug-loader`.
97-
The single `pug-plugin` replaces all most used functions of these plugins and loaders.
98-
Keep your webpack config clear and clean.
85+
The single `pug-plugin` replaces the functionality of `html-webpack-plugin` `mini-css-extract-plugin` `webpack-remove-empty-scripts` and `pug-loader`.
9986

10087
---
10188

@@ -153,7 +140,7 @@ Values:
153140
For example, exact this stage needs for properly work of the `@wordpress/dependency-extraction-webpack-plugin`.
154141

155142
Webpack plugins use different stages for their functionality.
156-
For properly work other plugins can be specified the `stage` when should be removed empty scripts: before or after processing of other webpack plugins.
143+
For properly work other plugins can be specified the `stage` when should be removed empty scripts: before or after processing of other Webpack plugins.
157144

158145
See [usage example](#usage-stage-optoion).
159146

@@ -271,6 +258,60 @@ new RemoveEmptyScriptsPlugin({
271258
`npm run test:coverage` will run the tests with coverage.
272259

273260

261+
## Who use this plugin
262+
263+
<a href='https://github.com/mozilla'>
264+
<img src='https://avatars.githubusercontent.com/u/131524?s=42&v=4'>
265+
</a>
266+
<a href='https://github.com/jenkinsci'>
267+
<img src='https://avatars.githubusercontent.com/u/107424?s=42&v=4'>
268+
</a>
269+
<a href='https://github.com/coinbase'>
270+
<img src='https://avatars.githubusercontent.com/u/1885080?s=42&v=4'>
271+
</a>
272+
<a href='https://github.com/PrestaShop'>
273+
<img src='https://avatars.githubusercontent.com/u/2815696?s=42&v=4'>
274+
</a>
275+
<a href='https://github.com/getsentry'>
276+
<img src='https://avatars.githubusercontent.com/u/1396951?s=42&v=4'>
277+
</a>
278+
<a href='https://github.com/standardnotes'>
279+
<img src='https://avatars.githubusercontent.com/u/24537496?s=42&v=4'>
280+
</a>
281+
<a href='https://github.com/woocommerce'>
282+
<img src='https://avatars.githubusercontent.com/u/473596?s=42&v=4'>
283+
</a>
284+
<a href='https://github.com/roots'>
285+
<img src='https://avatars.githubusercontent.com/u/4986074?s=42&v=4'>
286+
</a>
287+
<a href='https://github.com/ampproject'>
288+
<img src='https://avatars.githubusercontent.com/u/14114390?s=42&v=4'>
289+
</a>
290+
<a href='https://github.com/awesomemotive'>
291+
<img src='https://avatars.githubusercontent.com/u/8514352?s=42&v=4'>
292+
</a>
293+
<a href='https://github.com/10up'>
294+
<img src='https://avatars.githubusercontent.com/u/3358927?s=42&v=4'>
295+
</a>
296+
<a href='https://github.com/collab-project'>
297+
<img src='https://avatars.githubusercontent.com/u/347599?s=42&v=4'>
298+
</a>
299+
<a href='https://github.com/jspsych'>
300+
<img src='https://avatars.githubusercontent.com/u/16901698?s=42&v=4'>
301+
</a>
302+
<a href='https://github.com/grandnode'>
303+
<img src='https://avatars.githubusercontent.com/u/16118376?s=42&v=4'>
304+
</a>
305+
<a href='https://github.com/TheOdinProject'>
306+
<img src='https://avatars.githubusercontent.com/u/4441966?s=42&v=4'>
307+
</a>
308+
<a href='https://github.com/helsingborg-stad'>
309+
<img src='https://avatars.githubusercontent.com/u/12846276?s=42&v=4'>
310+
</a>
311+
<a href='https://github.com/City-of-Helsinki'>
312+
<img src='https://avatars.githubusercontent.com/u/1875564?s=42&v=4'>
313+
</a>
314+
274315
## Also See
275316

276317
- more examples of usages see in [test cases](https://github.com/webdiscus/webpack-remove-empty-scripts/tree/master/test/cases)

‎package.json

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,24 @@
11
{
22
"name": "webpack-remove-empty-scripts",
3-
"version": "1.0.0",
4-
"description": "Plugin for Webpack 5 to remove empty scripts generated by usage only style in webpack entry.",
3+
"version": "1.0.1",
4+
"description": "Plugin for Webpack 5 to remove empty JavaScript files generated when using only styles in Webpack entry.",
55
"keywords": [
66
"webpack",
77
"remove",
88
"empty",
99
"script",
10-
"style",
11-
"entry",
10+
"mini",
1211
"extract",
12+
"plugin",
13+
"entry",
14+
"style",
15+
"scss",
1316
"scss",
1417
"sass",
1518
"css",
16-
"js"
19+
"js",
20+
"javascript",
21+
"mini-css-extract-plugin"
1722
],
1823
"license": "ISC",
1924
"author": "webdiscus (https://github.com/webdiscus)",

0 commit comments

Comments
 (0)