update loaders & update plugins

Author: hello-lizhihua

src/content/loaders/babel-loader.md

@@ -6,35 +6,37 @@ repo: https://github.com/babel/babel-loader
 ---
 
 
+
+
 This package allows transpiling JavaScript files using [Babel](https://github.com/babel/babel) and [webpack](https://github.com/webpack/webpack).
 
-__Notes:__ Issues with the output should be reported on the babel [issue tracker](https://github.com/babel/babel/issues).
+**Note**: Issues with the output should be reported on the Babel [Issues](https://github.com/babel/babel/issues) tracker.
 
 ## Install
 
-> webpack 3.x | babel-loader 8.x | babel 7.x
+> webpack 4.x | babel-loader 8.x | babel 7.x
 
 ```bash
-npm install "babel-loader@^8.0.0-beta" @babel/core @babel/preset-env webpack
+npm install -D babel-loader @babel/core @babel/preset-env webpack
 ```
 
-> webpack 3.x babel-loader 7.x | babel 6.x
+> webpack 4.x | babel-loader 7.x | babel 6.x
 
 ```bash
-npm install babel-loader babel-core babel-preset-env webpack
+npm install -D babel-loader@7 babel-core babel-preset-env webpack
 ```
 
 ## Usage
 
-[Documentation: Using loaders](https://webpack.js.org/loaders/)
+webpack documentation: [Loaders](https://webpack.js.org/loaders/)
 
 Within your webpack configuration object, you'll need to add the babel-loader to the list of modules, like so:
 
 ```javascript
 module: {
   rules: [
     {
-      test: /\.js$/,
+      test: /\.m?js$/,
       exclude: /(node_modules|bower_components)/,
       use: {
         loader: 'babel-loader',
@@ -49,22 +51,21 @@ module: {
 
 ##
 
-See the `babel` [options](https://babeljs.io/docs/usage/api/#options).
+See the `babel` [options](https://babeljs.io/docs/en/options).
 
-
-You can pass options to the loader by using the [options property](https://webpack.js.org/configuration/module/#rule-options-rule-query):
+You can pass options to the loader by using the [`options`](https://webpack.js.org/configuration/module/#rule-options-rule-query) property:
 
 ```javascript
 module: {
   rules: [
     {
-      test: /\.js$/,
+      test: /\.m?js$/,
       exclude: /(node_modules|bower_components)/,
       use: {
         loader: 'babel-loader',
         options: {
           presets: ['@babel/preset-env'],
-          plugins: [require('@babel/plugin-proposal-object-rest-spread')]
+          plugins: ['@babel/plugin-proposal-object-rest-spread']
         }
       }
     }
@@ -74,48 +75,44 @@ module: {
 
 This loader also supports the following loader-specific option:
 
-* `cacheDirectory`: Default `false`. When set, the given directory will be used to cache the results of the loader. Future webpack builds will attempt to read from the cache to avoid needing to run the potentially expensive Babel recompilation process on each run. If the value is blank (`loader: 'babel-loader?cacheDirectory'`) or `true` (`loader: babel-loader?cacheDirectory=true`) the loader will use the default cache directory in `node_modules/.cache/babel-loader` or fallback to the default OS temporary file directory if no `node_modules` folder could be found in any root directory.
+* `cacheDirectory`: Default `false`. When set, the given directory will be used to cache the results of the loader. Future webpack builds will attempt to read from the cache to avoid needing to run the potentially expensive Babel recompilation process on each run. If the value is blank (`loader: 'babel-loader?cacheDirectory'`) or `true` (`loader: 'babel-loader?cacheDirectory=true'`), the loader will use the default cache directory in `node_modules/.cache/babel-loader` or fallback to the default OS temporary file directory if no `node_modules` folder could be found in any root directory.
+
+* `cacheIdentifier`: Default is a string composed by the `babel-core`'s version, the `babel-loader`'s version, the contents of `.babelrc` file if it exists, and the value of the environment variable `BABEL_ENV` with a fallback to the `NODE_ENV` environment variable. This can be set to a custom value to force cache busting if the identifier changes.
 
-* `cacheIdentifier`: Default is a string composed by the babel-core's version, the babel-loader's version, the contents of .babelrc file if it exists and the value of the environment variable `BABEL_ENV` with a fallback to the `NODE_ENV` environment variable. This can be set to a custom value to force cache busting if the identifier changes.
+* `cacheCompression`: Default `true`. When set, each Babel transform output will be compressed with Gzip. If you want to opt-out of cache compression, set it to `false` -- your project may benefit from this if it transpiles thousands of files.
 
-* `babelrc`: Default `true`. When `false`, no options from `.babelrc` files will be used; only the options passed to
-`babel-loader` will be used.
+* `customize`: Default `null`. The path of a module that exports a `custom` callback [like the one that you'd pass to `.custom()`](#customized-loader). Since you already have to make a new file to use this, it is recommended that you instead use `.custom` to create a wrapper loader. Only use this is you _must_ continue using `babel-loader` directly, but still want to customize.
 
-__Note:__ The `sourceMap` option is ignored, instead sourceMaps are automatically enabled when webpack is configured to use them (via the `devtool` config option).
+**Note**: The `sourceMap` option is ignored. Instead, source maps are automatically enabled when webpack is configured to use them (via the [`devtool`](https://webpack.js.org/configuration/devtool/#devtool) config option).
 
 ## Troubleshooting
 
 ### babel-loader is slow!
 
-Make sure you are transforming as few files as possible. Because you are probably
-matching `/\.js$/`, you might be transforming the `node_modules` folder or other unwanted
-source.
+Make sure you are transforming as few files as possible. Because you are probably matching `/\.m?js$/`, you might be transforming the `node_modules` folder or other unwanted source.
 
 To exclude `node_modules`, see the `exclude` option in the `loaders` config as documented above.
 
-You can also speed up babel-loader by as much as 2x by using the `cacheDirectory` option.
-This will cache transformations to the filesystem.
+You can also speed up babel-loader by as much as 2x by using the `cacheDirectory` option. This will cache transformations to the filesystem.
 
-### babel is injecting helpers into each file and bloating my code!
+### Babel is injecting helpers into each file and bloating my code!
 
-babel uses very small helpers for common functions such as `_extend`. By default
-this will be added to every file that requires it.
+Babel uses very small helpers for common functions such as `_extend`. By default, this will be added to every file that requires it.
 
-You can instead require the babel runtime as a separate module to avoid the duplication.
+You can instead require the Babel runtime as a separate module to avoid the duplication.
 
-The following configuration disables automatic per-file runtime injection in babel, instead
-requiring `babel-plugin-transform-runtime` and making all helper references use it.
+The following configuration disables automatic per-file runtime injection in Babel, requiring `babel-plugin-transform-runtime` instead and making all helper references use it.
 
 See the [docs](https://babeljs.io/docs/plugins/transform-runtime/) for more information.
 
-**NOTE:** You must run `npm install @babel/plugin-transform-runtime --save-dev` to include this in your project and `babel-runtime` itself as a dependency with `npm install @babel/runtime --save`.
+**NOTE**: You must run `npm install -D @babel/plugin-transform-runtime` to include this in your project and `babel-runtime` itself as a dependency with `npm install @babel/runtime`.
 
 ```javascript
 rules: [
-  // the 'transform-runtime' plugin tells babel to require the runtime
-  // instead of inlining it.
+  // the 'transform-runtime' plugin tells Babel to
+  // require the runtime instead of inlining it.
   {
-    test: /\.js$/,
+    test: /\.m?js$/,
     exclude: /(node_modules|bower_components)/,
     use: {
       loader: 'babel-loader',
@@ -128,9 +125,9 @@ rules: [
 ]
 ```
 
-#### **NOTE:** transform-runtime & custom polyfills (e.g. Promise library)
+#### **NOTE**: transform-runtime & custom polyfills (e.g. Promise library)
 
-Since [babel-plugin-transform-runtime](https://github.com/babel/babel/tree/master/packages/babel-plugin-transform-runtime) includes a polyfill that includes a custom [regenerator runtime](https://github.com/facebook/regenerator/blob/master/packages/regenerator-runtime/runtime.js) and [core.js](https://github.com/zloirock/core-js), the following usual shimming method using `webpack.ProvidePlugin` will not work:
+Since [babel-plugin-transform-runtime](https://github.com/babel/babel/tree/master/packages/babel-plugin-transform-runtime) includes a polyfill that includes a custom [regenerator-runtime](https://github.com/facebook/regenerator/blob/master/packages/regenerator-runtime/runtime.js) and [core-js](https://github.com/zloirock/core-js), the following usual shimming method using `webpack.ProvidePlugin` will not work:
 
 ```javascript
 // ...
@@ -174,23 +171,23 @@ require('@babel/runtime/core-js/promise').default = require('bluebird');
 require('./app');
 ```
 
-### The node API for `babel` has been moved to `babel-core`.
+### The Node.js API for `babel` has been moved to `babel-core`.
 
-If you receive this message it means that you have the npm package `babel` installed and use the short notation of the loader in the webpack config (which is not valid anymore as of webpack 2.x):
-```js
+If you receive this message, it means that you have the npm package `babel` installed and are using the short notation of the loader in the webpack config (which is not valid anymore as of webpack 2.x):
+```javascript
   {
-    test: /\.js$/,
+    test: /\.m?js$/,
     loader: 'babel',
   }
 ```
 
-Webpack then tries to load the `babel` package instead of the `babel-loader`.
+webpack then tries to load the `babel` package instead of the `babel-loader`.
 
-To fix this you should uninstall the npm package `babel` as it is deprecated in babel v6. (instead install `babel-cli` or `babel-core`)
+To fix this, you should uninstall the npm package `babel`, as it is deprecated in Babel v6. (Instead, install `babel-cli` or `babel-core`.)
 In the case one of your dependencies is installing `babel` and you cannot uninstall it yourself, use the complete name of the loader in the webpack config:
-```js
+```javascript
   {
-    test: /\.js$/,
+    test: /\.m?js$/,
     loader: 'babel-loader',
   }
 ```
@@ -204,9 +201,14 @@ of Babel's configuration for each file that it processes.
 `babel` so that tooling can ensure that it using exactly the same `@babel/core`
 instance as the loader itself.
 
+In cases where you want to customize without actually having a file to call `.custom`, you
+may also pass the `customize` option with a string pointing at a file that exports
+your `custom` callback function.
+
 ### Example
 
 ```js
+// Export from "./my-custom-loader.js" or whatever you want.
 module.exports = require("babel-loader").custom(babel => {
   function myPlugin() {
     return {
@@ -226,7 +228,7 @@ module.exports = require("babel-loader").custom(babel => {
       };
     },
 
-    // Passed Babel's 'PartialConfig' object. 
+    // Passed Babel's 'PartialConfig' object.
     config(cfg) {
       if (cfg.hasFilesystemConfig()) {
         // Use the normal config
@@ -254,6 +256,20 @@ module.exports = require("babel-loader").custom(babel => {
 });
 ```
 
+```js
+// And in your Webpack config
+module.exports = {
+  // ..
+  module: {
+    rules: [{
+      // ...
+      loader: path.join(__dirname, 'my-custom-loader.js'),
+      // ...
+    }]
+  }
+};
+```
+
 ### `customOptions(options: Object): { custom: Object, loader: Object }`
 
 Given the loader's options, split custom options out of `babel-loader`'s
@@ -271,4 +287,5 @@ be passed to `babel.transform`.
 Given Babel's result object, allow loaders to make additional tweaks to it.
 
 
-## [License](https://couto.mit-license.org/)
+## License
+[MIT](https://couto.mit-license.org/)

src/content/loaders/bundle-loader.md

@@ -12,7 +12,7 @@ Bundle loader for webpack
 npm i bundle-loader --save
 ```
 
-## <a href="https://webpack.js.org/concepts/loaders">Usage</a>
+## Usage
 
 **webpack.config.js**
 ```js

src/content/loaders/config-loader.md

@@ -14,6 +14,18 @@ repo: https://github.com/webpack-contrib/config-loader
 
 
 
+DEPRECATED. `webpack-command` is also deprecated. Please use `webpack-cli`. If any features were not implemented in `webpack-cli` feel free to create issue. 
+
+Why deprecated `webpack-command` ?
+- `webpack-cli` is very stable and have more features.
+- Two CLIs are misleading for developers.
+- Hard to maintain two package with same purpose.
+- The author stopped developing the package.
+- Most of the features are already implemented in `webpack-cli`.
+
+Thanks for using `webpack`! We apologize for the inconvenience. In the future, we will avoid such situations.
+_____
+
 A webpack configuration loader.
 
 This module utilizes [`cosmiconfig`](https://github.com/davidtheclark/cosmiconfig)

src/content/loaders/css-loader.md

@@ -41,7 +41,7 @@ module.exports = {
 
 ##
 
-You can also use the css-loader results directly as string, such as in Angular's component style.
+You can also use the css-loader results directly as a string, such as in Angular's component style.
 
 **webpack.config.js**
 ```js
@@ -106,6 +106,12 @@ url(~module/image.png) => require('module/image.png')
 
 ### `import`
 
+To import styles from a node module path, prefix it with a `~`:
+
+```css
+@import '~module/styles.css';
+```
+
 To disable `@import` resolving by `css-loader` set the option to `false`
 
 ```css
@@ -128,7 +134,7 @@ The syntax `:local(.className)` can be used to declare `className` in the local
 
 With `:local` (without brackets) local mode can be switched on for this selector. `:global(.className)` can be used to declare an explicit global selector. With `:global` (without brackets) global mode can be switched on for this selector.
 
-The loader replaces local selectors with unique identifiers. The choosen unique identifiers are exported by the module.
+The loader replaces local selectors with unique identifiers. The chosen unique identifiers are exported by the module.
 
 ```css
 :local(.className) { background: red; }
@@ -153,7 +159,7 @@ exports.locals = {
 }
 ```
 
-CamelCase is recommended for local selectors. They are easier to use in the within the imported JS module.
+CamelCase is recommended for local selectors. They are easier to use within the imported JS module.
 
 `url()` URLs in block scoped (`:local .abc`) rules behave like requests in modules.
 
@@ -271,9 +277,9 @@ You can also specify the absolute path to your custom `getLocalIdent` function t
 
 To include source maps set the `sourceMap` option.
 
-I. e. the extract-text-webpack-plugin can handle them.
+I.e. the extract-text-webpack-plugin can handle them.
 
-They are not enabled by default because they expose a runtime overhead and increase in bundle size (JS source maps do not). In addition to that relative paths are buggy and you need to use an absolute public path which include the server URL.
+They are not enabled by default because they expose a runtime overhead and increase in bundle size (JS source maps do not). In addition to that relative paths are buggy and you need to use an absolute public path which includes the server URL.
 
 **webpack.config.js**
 ```js
@@ -318,7 +324,7 @@ import { className } from 'file.css';
 
 ### `importLoaders`
 
-The query parameter `importLoaders` allows to configure how many loaders before `css-loader` should be applied to `@import`ed resources.
+The query parameter `importLoaders` allows you to configure how many loaders before `css-loader` should be applied to `@import`ed resources.
 
 **webpack.config.js**
 ```js
@@ -338,7 +344,7 @@ The query parameter `importLoaders` allows to configure how many loaders before
 }
 ```
 
-This may change in the future, when the module system (i. e. webpack) supports loader matching by origin.
+This may change in the future when the module system (i. e. webpack) supports loader matching by origin.
 
 ## Examples
 
@@ -369,7 +375,7 @@ module.exports = {
 
 ### Extract
 
-For production builds it's recommended to extract the CSS from your bundle being able to use parallel loading of CSS/JS resources later on. 
+For production builds it's recommended to extract the CSS from your bundle being able to use parallel loading of CSS/JS resources later on.
 This can be achieved by using the [mini-css-extract-plugin](/plugins/mini-css-extract-plugin/) to extract the CSS when running in production mode.
 
 ## Maintainers
@@ -435,11 +441,14 @@ This can be achieved by using the [mini-css-extract-plugin](/plugins/mini-css-ex
 [deps]: https://david-dm.org/webpack-contrib/css-loader.svg
 [deps-url]: https://david-dm.org/webpack-contrib/css-loader
 
-[tests]: http://img.shields.io/travis/webpack-contrib/css-loader.svg
-[tests-url]: https://travis-ci.org/webpack-contrib/css-loader
+[tests]: https://img.shields.io/circleci/project/github/webpack-contrib/css-loader.svg
+[tests-url]: https://circleci.com/gh/webpack-contrib/css-loader
 
 [cover]: https://codecov.io/gh/webpack-contrib/css-loader/branch/master/graph/badge.svg
 [cover-url]: https://codecov.io/gh/webpack-contrib/css-loader
 
 [chat]: https://badges.gitter.im/webpack/webpack.svg
 [chat-url]: https://gitter.im/webpack/webpack
+
+[size]: https://packagephobia.now.sh/badge?p=css-loader
+[size-url]: https://packagephobia.now.sh/result?p=css-loader

src/content/loaders/eslint-loader.md

@@ -104,8 +104,7 @@ See the [eslint docs](http://eslint.org/docs/developer-guide/nodejs-api#cliengin
 This option will enable
 [ESLint autofix feature](http://eslint.org/docs/user-guide/command-line-interface#fix).
 
-**Be careful: this option might cause webpack to enter an infinite build loop if
-some issues cannot be fixed properly.**
+**Be careful: this option will change source files.**
 
 #### `cache` (default: false)
 

src/content/loaders/expose-loader.md

@@ -102,7 +102,7 @@ module: {
 }
 ```
 
-The [`require.resolve`](https://nodejs.org/api/all.html#modules_require_resolve)
+The [`require.resolve`](https://nodejs.org/api/modules.html#modules_require_resolve_request_options)
 call is a Node.js function (unrelated to `require.resolve` in webpack
 processing). `require.resolve` gives you the
 absolute path to the module (`"/.../app/node_modules/react/react.js"`). So the
@@ -113,7 +113,7 @@ bundle.
 
 Please take a moment to read our contributing guidelines if you haven't yet done so.
 
-#### [CONTRIBUTING](https://raw.githubusercontent.com/webpack-contrib/expose-loader/master/.github/CONTRIBUTING)
+#### [CONTRIBUTING](https://raw.githubusercontent.com/webpack-contrib/expose-loader/master/.github/CONTRIBUTING.md)
 
 ## License
 
@@ -135,4 +135,4 @@ Please take a moment to read our contributing guidelines if you haven't yet done
 [cover-url]: https://codecov.io/gh/webpack-contrib/expose-loader
 
 [chat]: https://img.shields.io/badge/gitter-webpack%2Fwebpack-brightgreen.svg
-[chat-url]: https://gitter.im/webpack/webpack
+[chat-url]: https://gitter.im/webpack/webpack