update master (#377)

* docs(api): minor fix in cli

Make minor fix in the CLI documentation to reflect this comment:

webpack#1577 (comment)

* docs(plugins): clarify and simplify `SourceMapDevToolPlugin` docs (#1581)

Try to resolve the confusion from #1556. Also update the options
section to clean things up a bit both for readability and grammar.

Resolves #1556

* docs(guides): update "external limitations" example in author-libraries (#1583)

* docs(plugins): update commons-chunk-plugin.md (#1560)

Changed example to declare the plugin within `plugins` property.

* docs(guides): rewrite shimming (#1579)

Rewrite the main sections of the guide to synchronize it with
the other core guides. Briefly mention the other utilities that
don't require full on examples (details can be found via links).

Closes #1258

* docs(guides): fix small issues in shimming (#1591)

* docs(guides): fix entry path in typescript (#1592)

* docs(guides): fix typos in production (#1584)

* fix(sponsors): update to reflect opencollective change (#1588)

OpenCollective's structure changed a bit. This address that
and makes a few other notable changes:

- add additional sponsors
- allow to merge additional sponsors to existing sponsors
- limit width of logos to 3 x height to disallow very wide logos
- format money values with commas

* docs(config): update configuration-languages (#1590)

Remove local type def from TypeScript snippet. The @types/node type 
definition module already declares `__dirname` type:

https://git.io/v5Dr9

* docs(guides): update hot-module-replacement (#1539)

Add an example to demonstrate using hot module replacement with 
`webpack-dev-server`'s Node.js API instead of within a normal
configuration file.

* docs(guides): update development.md (#1586)

The article was missing references to `clean-webpack-plugin`
in the `webpack.config.js` file and `package.json` files.

* docs(guides): update tree-shaking.md (#1589)

As a conclusion, I thought it would be a good idea to show case 
a high-level explanation of why it's called tree shaking. Once the 
user reads the guide and ends up with a high-level explanation 
the word tree shaking will stick to the user's head.

* docs(guides): update code-splitting (#1585)

Suggest solutions to the problem right away seems to be a 
better approach. Use similar text as was used here:

https://webpack.js.org/api/module-methods/#import-

* docs(plugins): update module-concatenation-plugin (#1565)

Add more information about optimization bailouts. Attempt to transfer 
content from the blog post to the official docs. I want to follow up with 
a PR for better bailout reasons. The hope is that the reasons will match 
those listed in the table.

* docs(api): fix type in compiler.md (#1601)

* docs(config): update output.md (#1541)

Clarify interactions between `libraryTarget` and `library`. The 
interactions between the two and how some of the sections were not
well explained, in some cases were incorrect, misleading or missing
information.

* docs(api): add concurrent usage warning in node.md (#1599)

* docs(guides): update environment-variables (#1549)

Add documentation about setting environment variables in CLI with 
`--env`. Link to webpack _CLI Environment_ section. Add additional 
usage to `--env` CLI docs.

* Swap ordering of pre/post loaders (#1602)

`pre` loaders run at the beginning, `post` loaders run at the end.

* docs(sponsors): update segment's donations (#1603)

* update contributors

Author: hello-lizhihua

.gitignore

@@ -2,8 +2,7 @@ node_modules
 npm-debug.log
 build
 generated
-support-backers.json
-support-sponsors.json
+support-*.json
 starter-kits-data.json
 .antwar
 .idea

src/components/Splash/Splash.jsx

@@ -29,19 +29,19 @@ const Splash = () => (
         <p>通过你的贡献、捐款或者赞助，webpack 将获得繁荣发展。你的捐助直接用于支持我们付出工作、持续改进，最加重要的是有助于我们提供优秀的文档和资料！</p>
 
         <h2>平台赞助</h2>
-        <Support type="sponsors" rank="platinum" />
+        <Support rank="platinum" />
 
         <h2>金牌赞助</h2>
-        <Support type="sponsors" rank="gold" />
+        <Support rank="gold" />
 
         <h2>银牌赞助</h2>
-        <Support type="sponsors" rank="silver" />
+        <Support rank="silver" />
 
         <h2>铜牌赞助</h2>
-        <Support type="sponsors" rank="bronze" />
+        <Support rank="bronze" />
 
         <h2>赞助者</h2>
-        <Support type="backers" />
+        <Support rank="backer" />
       </Container>
     </div>
   </div>

src/components/Support/Support.jsx

@@ -1,9 +1,17 @@
 import React from 'react';
-import Additional from './support-additional.json';
+import GoldSponsors from './support-goldsponsors.json';
+import SilverSponsors from './support-silversponsors.json';
+import Sponsors from './support-sponsors.json';
+import Backers from './support-backers.json';
+import Additional from './support-additional.js';
 import './Support.scss';
 
 const ranks = {
+  backer: {
+    maximum: 200
+  },
   bronze: {
+    minimum: 200,
     maximum: 2000
   },
   silver: {
@@ -19,17 +27,37 @@ const ranks = {
   }
 };
 
+function formatMoney(number) {
+  let str = Math.round(number) + '';
+  if (str.length > 3) {
+    str = str.substr(0, str.length - 3) + ',' + str.substr(-3);
+  }
+  return str;
+}
+
 export default class Support extends React.Component {
   render() {
-    let { rank, type } = this.props;
-    let supporters = require(`./support-${type}.json`);
+    let { rank } = this.props;
+    let supporters = [
+      ...GoldSponsors,
+      ...SilverSponsors,
+      ...Sponsors,
+      ...Backers,
+    ];
 
-    if (type === 'sponsors') {
-      supporters = supporters.slice();
-      supporters.push(...Additional);
-      supporters.sort((a, b) => b.totalDonations - a.totalDonations);
+    // merge or add additional backers/sponsors
+    for(const additional of Additional) {
+      const existing = supporters.find(supporter => supporter.username && supporter.username === additional.username);
+      if (existing) {
+        existing.totalDonations += additional.totalDonations;
+      } else {
+        supporters.push(additional);
+      }
     }
 
+    // resort list
+    supporters.sort((a, b) => b.totalDonations - a.totalDonations);
+
     let minimum, maximum;
 
     if (rank && ranks[rank]) {
@@ -48,14 +76,14 @@ export default class Support extends React.Component {
     return (
       <div className="support">
         <div className="support__description">
-          { type === 'sponsors' ? (
+          { rank === 'backer' ? (
             <p>
-              <b className="support__rank">{ rank } sponsors</b>
-              <span>are those who have pledged { minimum ? `$${minimum}` : 'up' } { maximum ? `to $${maximum}` : 'or more' } to webpack.</span>
+              The following <b>Backers</b> are individuals who have contributed various amounts of money in order to help support webpack. Every little bit helps, and we appreciate even the smallest contributions.
             </p>
           ) : (
             <p>
-              The following <b>Backers</b> are individuals who have contributed various amounts of money in order to help support webpack. Every little bit helps, and we appreciate even the smallest contributions.
+              <b className="support__rank">{ rank } sponsors</b>
+              <span>are those who have pledged { minimum ? `$${formatMoney(minimum)}` : 'up' } { maximum ? `to $${formatMoney(maximum)}` : 'or more' } to webpack.</span>
             </p>
           )}
         </div>
@@ -64,22 +92,22 @@ export default class Support extends React.Component {
           supporters.map((supporter, index) => (
             <a key={ supporter.id || supporter.username || index }
                className="support__item"
-               title={ `$${supporter.totalDonations / 100} by ${supporter.name || supporter.username}` }
+               title={ `$${formatMoney(supporter.totalDonations / 100)} by ${supporter.name || supporter.username}` }
                target="_blank"
                href={ supporter.website || `https://opencollective.com/${supporter.username}` }>
               { supporter.avatar ? <img
-                className={ `support__${type}-avatar-${rank || 'normal'}` }
+                className={ `support__${rank}-avatar` }
                 src={ supporter.avatar }
                 alt={ supporter.username ? `${supporter.username}'s avatar` : 'avatar' } /> :
                 supporter.name }
-              { type === 'backers' ? <figure className="support__outline" /> : null }
+              { rank === 'backer' ? <figure className="support__outline" /> : null }
             </a>
           ))
         }
 
         <div className="support__bottom">
           <a className="support__button" href="https://opencollective.com/webpack#support">
-            Become a { type.replace(/s$/, '') }
+            Become a { rank === 'backer' ? 'backer' : 'sponsor' }
           </a>
         </div>
       </div>

src/components/Support/Support.scss

@@ -22,22 +22,25 @@
     margin: 0 2px 2px 2px;
   }
 
-  &__sponsors-avatar {
-    &-bronze, &-normal {
-      height: 32px;
-    }
-    &-silver {
-      height: 64px;
-    }
-    &-gold {
-      height: 96px;
-    }
-    &-platinum {
-      height: 128px;
-    }
+  &__bronze-avatar {
+    height: 32px;
+    max-width: 96px;
+  }
+
+  &__silver-avatar {
+    height: 64px;
+    max-width: 192px;
+  }
+
+  &__gold-avatar {
+    height: 96px;
+  }
+
+  &__platinum-avatar {
+    height: 128px;
   }
 
-  &__backers-avatar-normal {
+  &__backer-avatar {
     width: 31px;
     height: 31px;
     border-radius: 50%;

src/components/Support/assets/segment-logo.png

@@ -0,0 +1,38 @@
+export default [
+  {
+    name: "MoonMail",
+    avatar: "https://static.moonmail.io/moonmail-logo.svg",
+    website: "https://moonmail.io/?utm_source=webpack.js.org",
+    totalDonations: 11000,
+    reason: "Paypal"
+  },
+  {
+    name: "Google Angular",
+    avatar: "https://res.cloudinary.com/opencollective/image/upload/v1485288529/angular_uxllte.png",
+    website: "https://angular.io/?utm_source=webpack&utm_medium=documentation&utm_campaign=sponsorship",
+    totalDonations: 250000,
+    reason: "Paypal"
+  },
+  {
+    name: "Architects.io",
+    avatar: null,
+    website: "http://architects.io/?utm_source=webpack&utm_medium=documentation&utm_campaign=sponsorship",
+    totalDonations: 30000,
+    reason: "Paypal"
+  },
+  {
+    username: "peerigon",
+    name: "Peerigon",
+    avatar: "https://opencollective-production.s3-us-west-1.amazonaws.com/e8a1de10-99c8-11e6-8650-f92e594d5de8.png",
+    website: "https://peerigon.com/?utm_source=webpack&utm_medium=documentation&utm_campaign=sponsorship",
+    totalDonations: 144139,
+    reason: "webpack meetup 2017-07"
+  },
+  {
+    name: "Segment",
+    avatar: require("./assets/segment-logo.png"),
+    website: "https://segment.com/?utm_source=webpack&utm_medium=documentation&utm_campaign=sponsorship",
+    totalDonations: 2400000,
+    reason: "Sponsorship 2017-07 - 2017-09"
+  }
+];

src/components/Support/support-additional.js

@@ -1,23 +0,0 @@
-[
-  {
-    "name": "MoonMail",
-    "tier": "sponsor",
-    "avatar": "https://static.moonmail.io/moonmail-logo.svg",
-    "website": "https://moonmail.io/?utm_source=webpack.js.org",
-    "totalDonations": 11000
-  },
-  {
-    "name": "Google Angular",
-    "tier": "sponsor",
-    "avatar": "https://res.cloudinary.com/opencollective/image/upload/v1485288529/angular_uxllte.png",
-    "website": "https://angular.io/",
-    "totalDonations": 250000
-  },
-  {
-    "name": "Architects.io",
-    "tier": "sponsor",
-    "avatar": null,
-    "website": "http://architects.io/",
-    "totalDonations": 30000
-  }
-]

src/components/Support/support-additional.json

@@ -3,6 +3,7 @@ title: 参与翻译的全体成员
 contributors:
   - akira-cn
   - Aladdin-ADD
+  - AlenQi
   - beiciye
   - billie66
   - biqing
@@ -26,14 +27,17 @@ contributors:
   - lgh06
   - lizhonghui
   - lmymoonsky
+  - lukastong
   - mc-zone
   - neal1991
   - nick-nick
   - panlinying
+  - QC-L
   - rqzheng2015
   - scq000
   - ShiHaoLin
   - shisaq
+  - SimonLeeee
   - starkwang
   - superpig
   - tao1991123

src/content/about.md

@@ -130,14 +130,17 @@ webpack --env.platform=web  # 设置 env.platform == "web"
 
 `--env` 参数具有多种语法 accepts various syntaxes:
 
-Invocation                      | Resulting environment
-------------------------------- | ---------------------------
-`webpack --env prod`            | `"prod"`
-`webpack --env.prod`            | `{ prod: true }`
-`webpack --env.prod=1`          | `{ prod: 1 }`
-`webpack --env.prod=foo`        | `{ prod: "foo" }`
-`webpack --env.prod --env.min`  | `{ prod: true, min: true }`
-`webpack --env.prod --env min`  | `[{ prod: true }, "min"]`
+Invocation                               | Resulting environment
+---------------------------------------- | ---------------------------
+`webpack --env prod`                     | `"prod"`
+`webpack --env.prod`                     | `{ prod: true }`
+`webpack --env.prod=1`                   | `{ prod: 1 }`
+`webpack --env.prod=foo`                 | `{ prod: "foo" }`
+`webpack --env.prod --env.min`           | `{ prod: true, min: true }`
+`webpack --env.prod --env min`           | `[{ prod: true }, "min"]`
+`webpack --env.prod=foo --env.prod=bar`  | `{prod: [ "foo", "bar" ]}`
+
+T> See the [environment variables](/guides/environment-variables) guide for more information on its usage.
 
 ### 输出配置
 
@@ -292,7 +295,7 @@ webpack.js index=./src/index.js index2=./src/index2.js --output-path='./dist' --
 
 简写 | 含义
 ---------|----------------------------
--d       | `--debug --devtool cheap-module-source-map --output-pathinfo`
+-d       | `--debug --devtool cheap-module-eval-source-map --output-pathinfo`
 -p       | `--optimize-minimize --define process.env.NODE_ENV="production"`, see [building for production](/guides/production)
 
 

src/content/api/cli.md

@@ -70,6 +70,8 @@ T> webpack **不**会并行执行多个配置。每个配置只会在前一个
 * `.run(callback)`
 * `.watch(watchOptions, handler)`
 
+W> The API only supports a single concurrent compilation at a time. When using `run`, wait for it to finish before calling `run` or `watch` again. When using `watch`, call `close` and wait for it to finish before calling `run` or `watch` again. Concurrent compilations will corrupt the output files.
+
 
 ## 执行(Run)