[en] Webpack -> webpack (#1054)

* [en] Webpack -> webpack

* [docs] Webpack -> webpack in other languages

Author: Jinjiang

docs/en/README.md

@@ -2,37 +2,37 @@
 
 ### What is `vue-loader`?
 
-`vue-loader` is a loader for Webpack that can transform Vue components written in the following format into a plain JavaScript module:
+`vue-loader` is a loader for webpack that can transform Vue components written in the following format into a plain JavaScript module:
 
 ![screenshot](http://blog.evanyou.me/images/vue-component.png)
 
 There are many cool features provided by `vue-loader`:
 
 - ES2015 enabled by default;
-- Allows using other Webpack loaders for each part of a Vue component, for example SASS for `<style>` and Jade for `<template>`;
+- Allows using other webpack loaders for each part of a Vue component, for example SASS for `<style>` and Jade for `<template>`;
 - Allows custom sections in a .vue file that can have custom loader chains applied to them
-- Treat static assets referenced in `<style>` and `<template>` as module dependencies and handle them with Webpack loaders;
+- Treat static assets referenced in `<style>` and `<template>` as module dependencies and handle them with webpack loaders;
 - Can simulate scoped CSS for each component;
 - Supports component hot-reloading during development.
 
-In a nutshell, the combination of Webpack and `vue-loader` gives you a modern, flexible and extremely powerful front-end workflow for authoring Vue.js applications.
+In a nutshell, the combination of webpack and `vue-loader` gives you a modern, flexible and extremely powerful front-end workflow for authoring Vue.js applications.
 
-### What is Webpack?
+### What is webpack?
 
-If you are already familiar with Webpack, feel free to skip the following explanation. But for those of you who are new to Webpack, here's a quick intro:
+If you are already familiar with webpack, feel free to skip the following explanation. But for those of you who are new to webpack, here's a quick intro:
 
-[Webpack](https://webpack.github.io/) is a module bundler. It takes a bunch of files, treating each as a module, figuring out the dependencies between them, and bundle them into static assets that are ready for deployment.
+[webpack](https://webpack.github.io/) is a module bundler. It takes a bunch of files, treating each as a module, figuring out the dependencies between them, and bundle them into static assets that are ready for deployment.
 
 ![webpack](https://webpack.github.io/assets/what-is-webpack.png)
 
-For a basic example, imagine we have a bunch of CommonJS modules. They cannot run directly inside the browser, so we need to "bundle" them into a single file that can be included via a `<script>` tag. Webpack can follow the dependencies of the `require()` calls and do that for us.
+For a basic example, imagine we have a bunch of CommonJS modules. They cannot run directly inside the browser, so we need to "bundle" them into a single file that can be included via a `<script>` tag. webpack can follow the dependencies of the `require()` calls and do that for us.
 
-But Webpack can do more than that. With "loaders", we can teach Webpack to transform all types of files in any way we want before outputting the final bundle. Some examples include:
+But webpack can do more than that. With "loaders", we can teach webpack to transform all types of files in any way we want before outputting the final bundle. Some examples include:
 
 - Transpile ES2015, CoffeeScript or TypeScript modules into plain ES5 CommonJS modules;
 - Optionally you can pipe the source code through a linter before doing the compilation;
 - Transpile Jade templates into plain HTML and inline it as a JavaScript string;
 - Transpile SASS files into plain CSS, then convert it into a JavaScript snippet that insert the resulting CSS as a `<style>` tag;
 - Process an image file referenced in HTML or CSS, moved it to the desired destination based on the path configurations, and naming it using its md5 hash.
 
-Webpack is so powerful that when you understand how it works, it can dramatically improve your front-end workflow. Its primary drawback is its verbose and complex configuration; but with this guide you should be able to find solutions for most common issues when using Webpack with Vue.js and `vue-loader`.
+webpack is so powerful that when you understand how it works, it can dramatically improve your front-end workflow. Its primary drawback is its verbose and complex configuration; but with this guide you should be able to find solutions for most common issues when using webpack with Vue.js and `vue-loader`.

docs/en/configurations/advanced.md

@@ -12,7 +12,7 @@ To do that, specify the `loaders` option for `vue-loader`:
 
 > Note that `preLoaders` and `postLoaders` are only supported in 10.3.0+
 
-### Webpack 2.x
+### webpack 2.x
 
 ``` js
 module.exports = {
@@ -49,7 +49,7 @@ module.exports = {
           postLoaders: {
             html: 'babel-loader'
           },
-          
+
           // `excludedPreLoaders` should be regex
           excludedPreLoaders: /(eslint-loader)/
         }
@@ -59,7 +59,7 @@ module.exports = {
 }
 ```
 
-### Webpack 1.x
+### webpack 1.x
 
 ``` js
 // webpack.config.js

docs/en/configurations/asset-url.md

@@ -14,10 +14,10 @@ will be compiled into:
 createElement('img', { attrs: { src: require('../image.png') }})
 ```
 
-Because `.png` is not a JavaScript file, you will need to configure Webpack to use [file-loader](https://github.com/webpack/file-loader) or [url-loader](https://github.com/webpack/url-loader) to handle them. The project scaffolded with `vue-cli` has also configured this for you.
+Because `.png` is not a JavaScript file, you will need to configure webpack to use [file-loader](https://github.com/webpack/file-loader) or [url-loader](https://github.com/webpack/url-loader) to handle them. The project scaffolded with `vue-cli` has also configured this for you.
 
 The benefits of all this are:
 
-1. `file-loader` allows you to designate where to copy and place the asset file, and how to name it using version hashes for better caching. Moreover, this also means **you can just place images next to your `*.vue` files and use relative paths based on the folder structure instead of worrying about deployment URLs**. With proper config, Webpack will auto-rewrite the file paths into correct URLs in the bundled output.
+1. `file-loader` allows you to designate where to copy and place the asset file, and how to name it using version hashes for better caching. Moreover, this also means **you can just place images next to your `*.vue` files and use relative paths based on the folder structure instead of worrying about deployment URLs**. With proper config, webpack will auto-rewrite the file paths into correct URLs in the bundled output.
 
 2. `url-loader` allows you to conditionally inline a file as base-64 data URL if they are smaller than a given threshold. This can reduce the amount of HTTP requests for trivial files. If the file is larger than the threshold, it automatically falls back to `file-loader`.

docs/en/configurations/custom-blocks.md

@@ -41,7 +41,7 @@ comp-a h2 {
 #### webpack.config.js
 
 ``` js
-// Webpack 2.x
+// webpack 2.x
 var ExtractTextPlugin = require("extract-text-webpack-plugin")
 
 module.exports = {

docs/en/configurations/extract-css.md

@@ -39,7 +39,7 @@ Note this only extracts `*.vue` files though - CSS imported in JavaScript still
 
 Example config to extract all the processed CSS in all Vue components into a single CSS file:
 
-### Webpack 2.x
+### webpack 2.x
 
 
 ``` js
@@ -70,7 +70,7 @@ module.exports = {
 }
 ```
 
-### Webpack 1.x
+### webpack 1.x
 
 ``` bash
 npm install extract-text-webpack-plugin --save-dev

docs/en/configurations/pre-processors.md

@@ -1,6 +1,6 @@
 # Using Pre-Processors
 
-In Webpack, all pre-processors need to be applied with a corresponding loader. `vue-loader` allows you to use other Webpack loaders to process a part of a Vue component. It will automatically infer the proper loaders to use from the `lang` attribute of a language block.
+In webpack, all pre-processors need to be applied with a corresponding loader. `vue-loader` allows you to use other webpack loaders to process a part of a Vue component. It will automatically infer the proper loaders to use from the `lang` attribute of a language block.
 
 ### CSS
 
@@ -20,7 +20,7 @@ Under the hood, the text content inside the `<style>` tag will be first compiled
 
 #### sass-loader caveat
 
-Contrary to what its name indicates, [*sass*-loader](https://github.com/jtangelder/sass-loader) parses *SCSS* syntax by default. If you actually want to use the indented *SASS* syntax, you have to configure vue-loader's options for sass-loader accordingly. 
+Contrary to what its name indicates, [*sass*-loader](https://github.com/jtangelder/sass-loader) parses *SCSS* syntax by default. If you actually want to use the indented *SASS* syntax, you have to configure vue-loader's options for sass-loader accordingly.
 
 ```javascript
 {
@@ -69,7 +69,7 @@ scss: generateLoaders('sass').concat(
 ),
 ```
 
-It is recommended to only include variables, mixins, etc. in this file, to prevent duplicated css in your final, compiled files. 
+It is recommended to only include variables, mixins, etc. in this file, to prevent duplicated css in your final, compiled files.
 
 ### JavaScript
 
@@ -87,7 +87,7 @@ npm install coffee-loader --save-dev
 
 ### Templates
 
-Processing templates is a little different, because most Webpack template loaders such as `pug-loader` return a template function instead of a compiled HTML string. Instead of using `pug-loader`, we can just install the original `pug`:
+Processing templates is a little different, because most webpack template loaders such as `pug-loader` return a template function instead of a compiled HTML string. Instead of using `pug-loader`, we can just install the original `pug`:
 
 ``` bash
 npm install pug --save-dev
@@ -104,12 +104,12 @@ div
 
 ### Inline Loader Requests
 
-You can use [Webpack loader requests](https://webpack.github.io/docs/loaders.html#introduction) in the `lang` attribute:
+You can use [webpack loader requests](https://webpack.github.io/docs/loaders.html#introduction) in the `lang` attribute:
 
 ``` html
 <style lang="sass?outputStyle=expanded">
   /* use sass here with expanded output */
 </style>
 ```
 
-However, note this makes your Vue component Webpack-specific and not compatible with Browserify and [vueify](https://github.com/vuejs/vueify). **If you intend to ship your Vue component as a reusable 3rd-party component, avoid using this syntax.**
+However, note this makes your Vue component webpack-specific and not compatible with Browserify and [vueify](https://github.com/vuejs/vueify). **If you intend to ship your Vue component as a reusable 3rd-party component, avoid using this syntax.**

docs/en/features/es2015.md

@@ -58,7 +58,7 @@ You can also customize the features supported in templates using the [`buble` op
 
 ### Transpiling Normal `.js` Files
 
-Since `vue-loader` only processes `*.vue` files, you'd need to tell Webpack to process normal `*.js` files with `babel-loader` or `buble-loader` in the Webpack config file. The project scaffolded with `vue-cli` already does it for you.
+Since `vue-loader` only processes `*.vue` files, you'd need to tell webpack to process normal `*.js` files with `babel-loader` or `buble-loader` in the webpack config file. The project scaffolded with `vue-cli` already does it for you.
 
 ### Configuring Babel with `.babelrc`
 

docs/en/features/hot-reload.md

@@ -24,10 +24,10 @@ Advanced users may want to check out [vue-hot-reload-api](https://github.com/vue
 
 Hot Reload is always enabled except following situations:
 
- * Webpack `target` is `node` (SSR)
- * Webpack minifies the code
+ * webpack `target` is `node` (SSR)
+ * webpack minifies the code
  * `process.env.NODE_ENV === 'production'`
-  
+
 You may use `hotReload: false` option to disable the Hot Reload explicitly:
 
 ``` js
@@ -42,4 +42,4 @@ module: {
     }
   ]
 }
-```
+```

docs/en/features/postcss.md

@@ -16,7 +16,7 @@ Using a config file allows you to share the same config between your normal CSS
 
 Alternatively, you can specify postcss config specifically for `*.vue` files using the `postcss` option for `vue-loader`.
 
-Example usage in Webpack 1.x:
+Example usage in webpack 1.x:
 
 ``` js
 // webpack.config.js
@@ -29,7 +29,7 @@ module.exports = {
 }
 ```
 
-For Webpack 2.x:
+For webpack 2.x:
 
 ``` js
 // webpack.config.js

docs/en/options.md

@@ -1,8 +1,8 @@
 # Options Reference
 
-## Usage Difference Between Webpack 1 & 2
+## Usage Difference Between webpack 1 & 2
 
-For Webpack 2: pass the options directly to the loader rule.
+For webpack 2: pass the options directly to the loader rule.
 
 ``` js
 module.exports = {
@@ -21,7 +21,7 @@ module.exports = {
 }
 ```
 
-For Webpack 1.x: add a root `vue` block in your Webpack config.
+For webpack 1.x: add a root `vue` block in your webpack config.
 
 ``` js
 module.exports = {
@@ -36,7 +36,7 @@ module.exports = {
 
 - type: `{ [lang: string]: string }`
 
-  An object specifying Webpack loaders to overwrite the default loaders used for language blocks inside `*.vue` files. The key corresponds to the `lang` attribute for language blocks, if specified. The default `lang` for each type is:
+  An object specifying webpack loaders to overwrite the default loaders used for language blocks inside `*.vue` files. The key corresponds to the `lang` attribute for language blocks, if specified. The default `lang` for each type is:
 
   - `<template>`: `html`
   - `<script>`: `js`
@@ -45,7 +45,7 @@ module.exports = {
   For example, to use `babel-loader` and `eslint-loader` to process all `<script>` blocks:
 
   ``` js
-  // Webpack 2.x config
+  // webpack 2.x config
   module: {
     rules: [
       {
@@ -144,7 +144,7 @@ module.exports = {
 
   Whether to enable source maps for CSS. Disabling this can avoid some relative path related bugs in `css-loader` and make the build a bit faster.
 
-  Note this is automatically set to `false` if the `devtool` option is not present in the main Webpack config.
+  Note this is automatically set to `false` if the `devtool` option is not present in the main webpack config.
 
 ### esModule
 
@@ -183,7 +183,7 @@ module.exports = {
 - type: `{ [tag: string]: string | Array<string> }`
 - default: `{ img: 'src', image: 'xlink:href' }`
 
-  During template compilation, the compiler can transform certain attributes, such as `src` URLs, into `require` calls, so that the target asset can be handled by Webpack. The default config transforms the `src` attribute on `<img>` tags and `xlink:href` attribute on `<image>` tags of SVG.
+  During template compilation, the compiler can transform certain attributes, such as `src` URLs, into `require` calls, so that the target asset can be handled by webpack. The default config transforms the `src` attribute on `<img>` tags and `xlink:href` attribute on `<image>` tags of SVG.
 
 ### buble
 
@@ -319,5 +319,5 @@ Whether generate source maps with cache busting by appending a hash query to the
 - default: `true` in development mode, `false` in production mode or when the webpack config has `target: 'node'`.
 - allowed value: `false` (`true` will not force Hot Reload neither in production mode nor when `target: 'node'`)
 
-Whether to use Webpack [Hot Module Replacement](https://webpack.js.org/concepts/hot-module-replacement/) to apply changes in the browser **without reloading the page**.
-Use this option (value `false`) to disable the Hot Reload feature in development mode.     
+Whether to use webpack [Hot Module Replacement](https://webpack.js.org/concepts/hot-module-replacement/) to apply changes in the browser **without reloading the page**.
+Use this option (value `false`) to disable the Hot Reload feature in development mode.

docs/en/start/spec.md

@@ -56,7 +56,7 @@ More details can be found in [Using Pre-Processors](../configurations/pre-proces
 
 - Each `*.vue` file can contain at most one `<script>` block at a time.
 
-- The script is executed in a CommonJS like environment (just like a normal `.js` module bundled via Webpack), which means you can `require()` other dependencies. And with ES2015 support, you can also use the `import` and `export` syntax.
+- The script is executed in a CommonJS like environment (just like a normal `.js` module bundled via webpack), which means you can `require()` other dependencies. And with ES2015 support, you can also use the `import` and `export` syntax.
 
 - The script must export a Vue.js component options object. Exporting an extended constructor created by `Vue.extend()` is also supported, but a plain object is preferred.
 
@@ -68,7 +68,7 @@ More details can be found in [Using Pre-Processors](../configurations/pre-proces
 
 - A `<style>` tag can have `scoped` or `module` attributes (see [Scoped CSS](../features/scoped-css.md) and [CSS Modules](../features/css-modules.md)) to help encapsulate the styles to the current component. Multiple `<style>` tags with different encapsulation modes can be mixed in the same component.
 
-- By default, contents will be extracted and dynamically inserted into the document's `<head>` as an actual `<style>` tag using `style-loader`. It's also possible to [configure Webpack so that all styles in all components are extracted into a single CSS file](../configurations/extract-css.md).
+- By default, contents will be extracted and dynamically inserted into the document's `<head>` as an actual `<style>` tag using `style-loader`. It's also possible to [configure webpack so that all styles in all components are extracted into a single CSS file](../configurations/extract-css.md).
 
 ### Custom Blocks
 

docs/en/workflow/linting.md

@@ -39,9 +39,9 @@ module.exports = {
 }
 ```
 
-Note that Webpack loader chains are applied **right-first**. Make sure to apply `eslint` before `vue` so we are linting the pre-compile source code.
+Note that webpack loader chains are applied **right-first**. Make sure to apply `eslint` before `vue` so we are linting the pre-compile source code.
 
-One thing we need to consider is using third party `*.vue` components shipped in NPM packages. In such case, we want to use `vue-loader` to process the third party component, but do not want to lint it. We can separate the linting into Webpack's [preLoaders](https://webpack.github.io/docs/loaders.html#loader-order):
+One thing we need to consider is using third party `*.vue` components shipped in NPM packages. In such case, we want to use `vue-loader` to process the third party component, but do not want to lint it. We can separate the linting into webpack's [preLoaders](https://webpack.github.io/docs/loaders.html#loader-order):
 
 ``` js
 // webpack.config.js
@@ -67,7 +67,7 @@ module.exports = {
 }
 ```
 
-For Webpack 2.x:
+For webpack 2.x:
 
 ``` js
 // webpack.config.js

docs/en/workflow/production.md

@@ -24,7 +24,7 @@ module.exports = {
         warnings: false
       }
     }),
-    // Webpack 1 only - optimize module ids by occurrence count
+    // webpack 1 only - optimize module ids by occurrence count
     new webpack.optimize.OccurrenceOrderPlugin()
   ]
 }
@@ -34,6 +34,6 @@ Obviously we don't want to use this config during development, so there are seve
 
 1. Dynamically build up the configuration object based on an environment variable;
 
-2. Or, use two separate Webpack config files, one for development and one for production. And maybe share some common options between them in a third file, as shown in [vue-hackernews-2.0](https://github.com/vuejs/vue-hackernews-2.0).
+2. Or, use two separate webpack config files, one for development and one for production. And maybe share some common options between them in a third file, as shown in [vue-hackernews-2.0](https://github.com/vuejs/vue-hackernews-2.0).
 
 It's really up to you as long as it achieves the goal.