From 596a2544283314f993e225fe7f1f718cf586434e Mon Sep 17 00:00:00 2001
From: silentcloud <rjmuqiang@gmail.com>
Date: Wed, 30 Aug 2017 11:40:30 +0800
Subject: [PATCH 1/8] chore: update create-react-app, ref #27

---
 create-react-app/.gitignore                   |   1 -
 create-react-app/README.md                    |   5 +-
 create-react-app/config/env.js                |  11 +-
 create-react-app/config/paths.js              |   4 +-
 create-react-app/config/webpack.config.dev.js | 236 +++++++--------
 .../config/webpack.config.prod.js             | 279 +++++++++---------
 .../config/webpackDevServer.config.js         |   6 +-
 create-react-app/package.json                 |  86 +++---
 create-react-app/public/favicon.ico           | Bin 24838 -> 3870 bytes
 create-react-app/public/index.html            |   5 +-
 create-react-app/scripts/build.js             |  30 +-
 create-react-app/src/App.css                  |   8 +-
 create-react-app/src/index.css                |   1 -
 create-react-app/src/index.js                 |   2 +-
 create-react-app/src/registerServiceWorker.js | 109 +++++--
 15 files changed, 436 insertions(+), 347 deletions(-)

diff --git a/create-react-app/.gitignore b/create-react-app/.gitignore
index bb5f2bb..d30f40e 100644
--- a/create-react-app/.gitignore
+++ b/create-react-app/.gitignore
@@ -19,4 +19,3 @@
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
-yarn.lock
diff --git a/create-react-app/README.md b/create-react-app/README.md
index 650eaa6..240dabe 100644
--- a/create-react-app/README.md
+++ b/create-react-app/README.md
@@ -32,7 +32,7 @@ First we install antd-mobile and [babel-plugin-import](https://github.com/ant-de
 
   ```bash
   $ yarn add antd-mobile
-  $ yarn add babel-plugin-import --dev
+  $ yarn add babel-plugin-import less-loader postcss-pxtorem svg-sprite-loader@0.3.1 --dev
   ```
 
 1. Modify `config/webpack.config.dev.js`
@@ -45,6 +45,7 @@ First we install antd-mobile and [babel-plugin-import](https://github.com/ant-de
         exclude: [
           ...
           /\.less$/,
+          /\.svg$/,
           ...
         ]
       },
@@ -109,4 +110,4 @@ First we install antd-mobile and [babel-plugin-import](https://github.com/ant-de
     if(!window.Promise) {
       document.writeln('<script src="https://as.alipayobjects.com/g/component/es6-promise/3.2.2/es6-promise.min.js"'+'>'+'<'+'/'+'script>');
     }
-    ```  
+    ```  
\ No newline at end of file
diff --git a/create-react-app/config/env.js b/create-react-app/config/env.js
index 7c6133b..8b39b6c 100644
--- a/create-react-app/config/env.js
+++ b/create-react-app/config/env.js
@@ -78,13 +78,10 @@ function getClientEnvironment(publicUrl) {
     );
   // Stringify all values so we can feed into Webpack DefinePlugin
   const stringified = {
-    'process.env': Object.keys(raw).reduce(
-      (env, key) => {
-        env[key] = JSON.stringify(raw[key]);
-        return env;
-      },
-      {}
-    ),
+    'process.env': Object.keys(raw).reduce((env, key) => {
+      env[key] = JSON.stringify(raw[key]);
+      return env;
+    }, {}),
   };
 
   return { raw, stringified };
diff --git a/create-react-app/config/paths.js b/create-react-app/config/paths.js
index 2efd3b7..6d16efc 100644
--- a/create-react-app/config/paths.js
+++ b/create-react-app/config/paths.js
@@ -33,8 +33,8 @@ const getPublicUrl = appPackageJson =>
 // like /todos/42/static/js/bundle.7289d.js. We have to know the root.
 function getServedPath(appPackageJson) {
   const publicUrl = getPublicUrl(appPackageJson);
-  const servedUrl = envPublicUrl ||
-    (publicUrl ? url.parse(publicUrl).pathname : '/');
+  const servedUrl =
+    envPublicUrl || (publicUrl ? url.parse(publicUrl).pathname : '/');
   return ensureSlash(servedUrl, true);
 }
 
diff --git a/create-react-app/config/webpack.config.dev.js b/create-react-app/config/webpack.config.dev.js
index 2f34fad..adf103b 100644
--- a/create-react-app/config/webpack.config.dev.js
+++ b/create-react-app/config/webpack.config.dev.js
@@ -4,7 +4,6 @@ const autoprefixer = require('autoprefixer');
 const path = require('path');
 const webpack = require('webpack');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
-const pxtorem = require('postcss-pxtorem');
 const CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin');
 const InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin');
 const WatchMissingNodeModulesPlugin = require('react-dev-utils/WatchMissingNodeModulesPlugin');
@@ -12,6 +11,7 @@ const eslintFormatter = require('react-dev-utils/eslintFormatter');
 const ModuleScopePlugin = require('react-dev-utils/ModuleScopePlugin');
 const getClientEnvironment = require('./env');
 const paths = require('./paths');
+const pxtorem = require('postcss-pxtorem');
 
 // Webpack uses `publicPath` to determine where the app is being served from.
 // In development, we always serve from the root. This makes config easier.
@@ -47,8 +47,6 @@ module.exports = {
     require.resolve('react-dev-utils/webpackHotDevClient'),
     // We ship a few polyfills by default:
     require.resolve('./polyfills'),
-    // Errors should be considered fatal in development
-    require.resolve('react-error-overlay'),
     // Finally, this is your app's code:
     paths.appIndexJs,
     // We include the app code last so that if there is a runtime error during
@@ -68,9 +66,9 @@ module.exports = {
     chunkFilename: 'static/js/[name].chunk.js',
     // This is the URL that app is served from. We use "/" in development.
     publicPath: publicPath,
-    // Point sourcemap entries to original disk location
+    // Point sourcemap entries to original disk location (format as URL on Windows)
     devtoolModuleFilenameTemplate: info =>
-      path.resolve(info.absoluteResourcePath),
+      path.resolve(info.absoluteResourcePath).replace(/\\/g, '/'),
   },
   resolve: {
     // This allows you to set a fallback for where Webpack should look for modules.
@@ -85,9 +83,11 @@ module.exports = {
     // We also include JSX as a common component filename extension to support
     // some tools, although we do not recommend using it, see:
     // https://github.com/facebookincubator/create-react-app/issues/290
-    extensions: ['.web.js', '.js', '.json', '.jsx'],
+    // `web` extension prefixes have been added for better support
+    // for React Native Web.
+    extensions: ['.web.js', '.js', '.json', '.web.jsx', '.jsx'],
     alias: {
-
+      
       // Support React Native Web
       // https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/
       'react-native': 'react-native-web',
@@ -98,7 +98,7 @@ module.exports = {
       // To fix this, we prevent you from importing files out of src/ -- if you'd like to,
       // please link the files into your node_modules/ and let module-resolution kick in.
       // Make sure your source files are compiled, as they will not be processed in any way.
-      new ModuleScopePlugin(paths.appSrc),
+      new ModuleScopePlugin(paths.appSrc, [paths.appPackageJson]),
     ],
   },
   module: {
@@ -117,140 +117,139 @@ module.exports = {
           {
             options: {
               formatter: eslintFormatter,
-
+              eslintPath: require.resolve('eslint'),
+              
             },
             loader: require.resolve('eslint-loader'),
           },
         ],
         include: paths.appSrc,
       },
-      // ** ADDING/UPDATING LOADERS **
-      // The "file" loader handles all assets unless explicitly excluded.
-      // The `exclude` list *must* be updated with every change to loader extensions.
-      // When adding a new loader, you must add its `test`
-      // as a new entry in the `exclude` list for "file" loader.
-
-      // "file" loader makes sure those assets get served by WebpackDevServer.
-      // When you `import` an asset, you get its (virtual) filename.
-      // In production, they would get copied to the `build` folder.
-      {
-        exclude: [
-          /\.html$/,
-          /\.(js|jsx)$/,
-          /\.less$/,
-          /\.css$/,
-          /\.json$/,
-          /\.bmp$/,
-          /\.gif$/,
-          /\.jpe?g$/,
-          /\.png$/,
-          /\.svg$/,
-        ],
-        loader: require.resolve('file-loader'),
-        options: {
-          name: 'static/media/[name].[hash:8].[ext]',
-        },
-      },
-      // "url" loader works like "file" loader except that it embeds assets
-      // smaller than specified limit in bytes as data URLs to avoid requests.
-      // A missing `test` is equivalent to a match.
-      {
-        test: [/\.bmp$/, /\.gif$/, /\.jpe?g$/, /\.png$/],
-        loader: require.resolve('url-loader'),
-        options: {
-          limit: 10000,
-          name: 'static/media/[name].[hash:8].[ext]',
-        },
-      },
-      // Process JS with Babel.
-      {
-        test: /\.(js|jsx)$/,
-        include: paths.appSrc,
-        loader: require.resolve('babel-loader'),
-        options: {
-          plugins: [
-            ['import', { libraryName: 'antd-mobile', style: true }],
-          ],
-          // This is a feature of `babel-loader` for webpack (not Babel itself).
-          // It enables caching results in ./node_modules/.cache/babel-loader/
-          // directory for faster rebuilds.
-          cacheDirectory: true,
-        },
-      },
-      // "postcss" loader applies autoprefixer to our CSS.
-      // "css" loader resolves paths in CSS and adds assets as dependencies.
-      // "style" loader turns CSS into JS modules that inject <style> tags.
-      // In production, we use a plugin to extract that CSS to a file, but
-      // in development "style" loader enables hot editing of CSS.
       {
-        test: /\.css$/,
-        use: [
-          require.resolve('style-loader'),
+        // "oneOf" will traverse all following loaders until one will
+        // match the requirements. When no loader matches it will fall
+        // back to the "file" loader at the end of the loader list.
+        oneOf: [
+          // "url" loader works like "file" loader except that it embeds assets
+          // smaller than specified limit in bytes as data URLs to avoid requests.
+          // A missing `test` is equivalent to a match.
           {
-            loader: require.resolve('css-loader'),
+            test: [/\.bmp$/, /\.gif$/, /\.jpe?g$/, /\.png$/],
+            loader: require.resolve('url-loader'),
             options: {
-              importLoaders: 1,
+              limit: 10000,
+              name: 'static/media/[name].[hash:8].[ext]',
             },
           },
+          // Process JS with Babel.
           {
-            loader: require.resolve('postcss-loader'),
+            test: /\.(js|jsx)$/,
+            include: paths.appSrc,
+            loader: require.resolve('babel-loader'),
             options: {
-              ident: 'postcss', // https://webpack.js.org/guides/migrating/#complex-options
-              plugins: () => [
-                require('postcss-flexbugs-fixes'),
-                autoprefixer({
-                  browsers: [
-                    '>1%',
-                    'last 4 versions',
-                    'Firefox ESR',
-                    'not ie < 9', // React doesn't support IE8 anyway
-                  ],
-                  flexbox: 'no-2009',
-                }),
+              plugins: [
+                ['import', { libraryName: 'antd-mobile', style: true }],
               ],
+              // This is a feature of `babel-loader` for webpack (not Babel itself).
+              // It enables caching results in ./node_modules/.cache/babel-loader/
+              // directory for faster rebuilds.
+              cacheDirectory: true,
             },
           },
-        ],
-      },
-      {
-        test: /\.(svg)$/i,
-        loader: 'svg-sprite-loader',
-        include: [
-          require.resolve('antd-mobile').replace(/warn\.js$/, ''),  // 1. svg files of antd-mobile
-          path.resolve(__dirname, '../src/'),  // folder of svg files in your project
-        ]
-      },
-        // Parse less files and modify variables
-      {
-        test: /\.less$/,
-        use: [
-          require.resolve('style-loader'),
-          require.resolve('css-loader'),
+          // "postcss" loader applies autoprefixer to our CSS.
+          // "css" loader resolves paths in CSS and adds assets as dependencies.
+          // "style" loader turns CSS into JS modules that inject <style> tags.
+          // In production, we use a plugin to extract that CSS to a file, but
+          // in development "style" loader enables hot editing of CSS.
           {
-            loader: require.resolve('postcss-loader'),
-            options: {
-              ident: 'postcss', // https://webpack.js.org/guides/migrating/#complex-options
-              plugins: () => [
-                pxtorem({
-                  rootValue: 100,
-                  propWhiteList: [],
-                }),
-                autoprefixer({
-                  browsers: ['last 2 versions', 'Firefox ESR', '> 1%', 'ie >= 8', 'iOS >= 8', 'Android >= 4'],
-                }),
-              ],
-            },
+            test: /\.css$/,
+            use: [
+              require.resolve('style-loader'),
+              {
+                loader: require.resolve('css-loader'),
+                options: {
+                  importLoaders: 1,
+                },
+              },
+              {
+                loader: require.resolve('postcss-loader'),
+                options: {
+                  // Necessary for external CSS imports to work
+                  // https://github.com/facebookincubator/create-react-app/issues/2677
+                  ident: 'postcss',
+                  plugins: () => [
+                    require('postcss-flexbugs-fixes'),
+                    autoprefixer({
+                      browsers: [
+                        '>1%',
+                        'last 4 versions',
+                        'Firefox ESR',
+                        'not ie < 9', // React doesn't support IE8 anyway
+                      ],
+                      flexbox: 'no-2009',
+                    }),
+                  ],
+                },
+              },
+            ],
+          },
+          {
+            test: /\.(svg)$/i,
+            loader: 'svg-sprite-loader',
+            include: [
+              require.resolve('antd-mobile').replace(/warn\.js$/, ''),  // 1. svg files of antd-mobile
+              path.resolve(__dirname, '../src/'),  // folder of svg files in your project
+            ]
           },
+          // "file" loader makes sure those assets get served by WebpackDevServer.
+          // When you `import` an asset, you get its (virtual) filename.
+          // In production, they would get copied to the `build` folder.
+          // This loader don't uses a "test" so it will catch all modules
+          // that fall through the other loaders.
           {
-            loader: require.resolve('less-loader'),
+            // Exclude `js` files to keep "css" loader working as it injects
+            // it's runtime that would otherwise processed through "file" loader.
+            // Also exclude `html` and `json` extensions so they get processed
+            // by webpacks internal loaders.
+            exclude: [/\.js$/, /\.html$/, /\.json$/, /\.svg$/, /\.less$/],
+            loader: require.resolve('file-loader'),
             options: {
-              modifyVars: { "@primary-color": "#1DA57A" },
+              name: 'static/media/[name].[hash:8].[ext]',
             },
           },
+            // Parse less files and modify variables
+          {
+            test: /\.less$/,
+            use: [
+              require.resolve('style-loader'),
+              require.resolve('css-loader'),
+              {
+                loader: require.resolve('postcss-loader'),
+                options: {
+                  ident: 'postcss', // https://webpack.js.org/guides/migrating/#complex-options
+                  plugins: () => [
+                    pxtorem({
+                      rootValue: 100,
+                      propWhiteList: [],
+                    }),
+                    autoprefixer({
+                      browsers: ['last 2 versions', 'Firefox ESR', '> 1%', 'ie >= 8', 'iOS >= 8', 'Android >= 4'],
+                    }),
+                  ],
+                },
+              },
+              {
+                loader: require.resolve('less-loader'),
+                options: {
+                  modifyVars: { "@primary-color": "#1DA57A" },
+                },
+              },
+            ],
+          },
         ],
       },
       // ** STOP ** Are you adding a new loader?
-      // Remember to add the new extension(s) to the "file" loader exclusion list.
+      // Make sure to add the new loader(s) before the "file" loader.
     ],
   },
   plugins: [
@@ -264,6 +263,8 @@ module.exports = {
       inject: true,
       template: paths.appHtml,
     }),
+    // Add module names to factory functions so they appear in browser profiler.
+    new webpack.NamedModulesPlugin(),
     // Makes some environment variables available to the JS code, for example:
     // if (process.env.NODE_ENV === 'development') { ... }. See `./env.js`.
     new webpack.DefinePlugin(env.stringified),
@@ -288,6 +289,7 @@ module.exports = {
   // Some libraries import Node modules but don't use them in the browser.
   // Tell Webpack to provide empty mocks for them so importing them works.
   node: {
+    dgram: 'empty',
     fs: 'empty',
     net: 'empty',
     tls: 'empty',
diff --git a/create-react-app/config/webpack.config.prod.js b/create-react-app/config/webpack.config.prod.js
index dbe023e..44d90d4 100644
--- a/create-react-app/config/webpack.config.prod.js
+++ b/create-react-app/config/webpack.config.prod.js
@@ -4,7 +4,6 @@ const autoprefixer = require('autoprefixer');
 const path = require('path');
 const webpack = require('webpack');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
-const pxtorem = require('postcss-pxtorem');
 const ExtractTextPlugin = require('extract-text-webpack-plugin');
 const ManifestPlugin = require('webpack-manifest-plugin');
 const InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin');
@@ -13,6 +12,7 @@ const eslintFormatter = require('react-dev-utils/eslintFormatter');
 const ModuleScopePlugin = require('react-dev-utils/ModuleScopePlugin');
 const paths = require('./paths');
 const getClientEnvironment = require('./env');
+const pxtorem = require('postcss-pxtorem');
 
 // Webpack uses `publicPath` to determine where the app is being served from.
 // It requires a trailing slash, or the file assets will get an incorrect path.
@@ -20,6 +20,8 @@ const publicPath = paths.servedPath;
 // Some apps do not use client-side routing with pushState.
 // For these, "homepage" can be set to "." to enable relative asset paths.
 const shouldUseRelativeAssetPaths = publicPath === './';
+// Source maps are resource heavy and can cause out of memory issue for large source files.
+const shouldUseSourceMap = process.env.GENERATE_SOURCEMAP !== 'false';
 // `publicUrl` is just like `publicPath`, but we will provide it to our app
 // as %PUBLIC_URL% in `index.html` and `process.env.PUBLIC_URL` in JavaScript.
 // Omit trailing slash as %PUBLIC_URL%/xyz looks better than %PUBLIC_URL%xyz.
@@ -53,7 +55,7 @@ module.exports = {
   bail: true,
   // We generate sourcemaps in production. This is slow but gives good results.
   // You can exclude the *.map files from the build during deployment.
-  devtool: 'source-map',
+  devtool: shouldUseSourceMap ? 'source-map' : false,
   // In production, we only want to load the polyfills and the app code.
   entry: [require.resolve('./polyfills'), paths.appIndexJs],
   output: {
@@ -66,9 +68,11 @@ module.exports = {
     chunkFilename: 'static/js/[name].[chunkhash:8].chunk.js',
     // We inferred the "public path" (such as / or /my-project) from homepage.
     publicPath: publicPath,
-    // Point sourcemap entries to original disk location
+    // Point sourcemap entries to original disk location (format as URL on Windows)
     devtoolModuleFilenameTemplate: info =>
-      path.relative(paths.appSrc, info.absoluteResourcePath),
+      path
+        .relative(paths.appSrc, info.absoluteResourcePath)
+        .replace(/\\/g, '/'),
   },
   resolve: {
     // This allows you to set a fallback for where Webpack should look for modules.
@@ -83,9 +87,11 @@ module.exports = {
     // We also include JSX as a common component filename extension to support
     // some tools, although we do not recommend using it, see:
     // https://github.com/facebookincubator/create-react-app/issues/290
-    extensions: ['.web.js', '.js', '.json', '.jsx'],
+    // `web` extension prefixes have been added for better support
+    // for React Native Web.
+    extensions: ['.web.js', '.js', '.json', '.web.jsx', '.jsx'],
     alias: {
-
+      
       // Support React Native Web
       // https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/
       'react-native': 'react-native-web',
@@ -96,7 +102,7 @@ module.exports = {
       // To fix this, we prevent you from importing files out of src/ -- if you'd like to,
       // please link the files into your node_modules/ and let module-resolution kick in.
       // Make sure your source files are compiled, as they will not be processed in any way.
-      new ModuleScopePlugin(paths.appSrc),
+      new ModuleScopePlugin(paths.appSrc, [paths.appPackageJson]),
     ],
   },
   module: {
@@ -115,146 +121,145 @@ module.exports = {
           {
             options: {
               formatter: eslintFormatter,
-
+              eslintPath: require.resolve('eslint'),
+              
             },
             loader: require.resolve('eslint-loader'),
           },
         ],
         include: paths.appSrc,
       },
-      // ** ADDING/UPDATING LOADERS **
-      // The "file" loader handles all assets unless explicitly excluded.
-      // The `exclude` list *must* be updated with every change to loader extensions.
-      // When adding a new loader, you must add its `test`
-      // as a new entry in the `exclude` list in the "file" loader.
-
-      // "file" loader makes sure those assets end up in the `build` folder.
-      // When you `import` an asset, you get its filename.
       {
-        exclude: [
-          /\.html$/,
-          /\.(js|jsx)$/,
-          /\.css$/,
-          /\.json$/,
-          /\.bmp$/,
-          /\.gif$/,
-          /\.jpe?g$/,
-          /\.png$/,
-          /\.less$/,
-          /\.svg$/,
-        ],
-        loader: require.resolve('file-loader'),
-        options: {
-          name: 'static/media/[name].[hash:8].[ext]',
-        },
-      },
-      // "url" loader works just like "file" loader but it also embeds
-      // assets smaller than specified size as data URLs to avoid requests.
-      {
-        test: [/\.bmp$/, /\.gif$/, /\.jpe?g$/, /\.png$/],
-        loader: require.resolve('url-loader'),
-        options: {
-          limit: 10000,
-          name: 'static/media/[name].[hash:8].[ext]',
-        },
-      },
-      // Process JS with Babel.
-      {
-        test: /\.(js|jsx)$/,
-        include: paths.appSrc,
-        loader: require.resolve('babel-loader'),
-        options: {
-          plugins: [
-            ['import', { libraryName: 'antd-mobile', style: true }],
-          ],
-          cacheDirectory: true,
-        }
-      },
-      // The notation here is somewhat confusing.
-      // "postcss" loader applies autoprefixer to our CSS.
-      // "css" loader resolves paths in CSS and adds assets as dependencies.
-      // "style" loader normally turns CSS into JS modules injecting <style>,
-      // but unlike in development configuration, we do something different.
-      // `ExtractTextPlugin` first applies the "postcss" and "css" loaders
-      // (second argument), then grabs the result CSS and puts it into a
-      // separate file in our build process. This way we actually ship
-      // a single CSS file in production instead of JS code injecting <style>
-      // tags. If you use code splitting, however, any async bundles will still
-      // use the "style" loader inside the async code so CSS from them won't be
-      // in the main CSS file.
-      {
-        test: /\.css$/,
-        loader: ExtractTextPlugin.extract(
-          Object.assign(
-            {
-              fallback: require.resolve('style-loader'),
-              use: [
-                {
-                  loader: require.resolve('css-loader'),
-                  options: {
-                    importLoaders: 1,
-                    minimize: true,
-                    sourceMap: true,
-                  },
-                },
-                {
-                  loader: require.resolve('postcss-loader'),
-                  options: {
-                    ident: 'postcss', // https://webpack.js.org/guides/migrating/#complex-options
-                    plugins: () => [
-                      require('postcss-flexbugs-fixes'),
-                      autoprefixer({
-                        browsers: [
-                          '>1%',
-                          'last 4 versions',
-                          'Firefox ESR',
-                          'not ie < 9', // React doesn't support IE8 anyway
-                        ],
-                        flexbox: 'no-2009',
-                      }),
-                    ],
-                  },
-                },
-              ],
+        // "oneOf" will traverse all following loaders until one will
+        // match the requirements. When no loader matches it will fall
+        // back to the "file" loader at the end of the loader list.
+        oneOf: [
+          // "url" loader works just like "file" loader but it also embeds
+          // assets smaller than specified size as data URLs to avoid requests.
+          {
+            test: [/\.bmp$/, /\.gif$/, /\.jpe?g$/, /\.png$/],
+            loader: require.resolve('url-loader'),
+            options: {
+              limit: 10000,
+              name: 'static/media/[name].[hash:8].[ext]',
             },
-            extractTextPluginOptions
-          )
-        ),
-        // Note: this won't work without `new ExtractTextPlugin()` in `plugins`.
-      },
-      // ** STOP ** Are you adding a new loader?
-      // Remember to add the new extension(s) to the "file" loader exclusion list.
-      {
-        test: /\.(svg)$/i,
-        loader: 'svg-sprite-loader',
-        include: [
-          require.resolve('antd-mobile').replace(/warn\.js$/, ''),  // 1. svg files of antd-mobile
-          path.resolve(__dirname, '../src/'),  // folder of svg files in your project
-        ]
-      },
-      {
-        test: /\.less$/,
-        use: [
-          require.resolve('style-loader'),
-          require.resolve('css-loader'),
+          },
+          // Process JS with Babel.
           {
-            loader: require.resolve('postcss-loader'),
+            test: /\.(js|jsx)$/,
+            include: paths.appSrc,
+            loader: require.resolve('babel-loader'),
             options: {
-              ident: 'postcss', // https://webpack.js.org/guides/migrating/#complex-options
-              plugins: () => [
-                autoprefixer({
-                  browsers: ['last 2 versions', 'Firefox ESR', '> 1%', 'ie >= 8', 'iOS >= 8', 'Android >= 4'],
-                }),
-                pxtorem({ rootValue: 100, propWhiteList: [] })
+              plugins: [
+                ['import', { libraryName: 'antd-mobile', style: true }],
               ],
+              compact: true,
             },
           },
+          // The notation here is somewhat confusing.
+          // "postcss" loader applies autoprefixer to our CSS.
+          // "css" loader resolves paths in CSS and adds assets as dependencies.
+          // "style" loader normally turns CSS into JS modules injecting <style>,
+          // but unlike in development configuration, we do something different.
+          // `ExtractTextPlugin` first applies the "postcss" and "css" loaders
+          // (second argument), then grabs the result CSS and puts it into a
+          // separate file in our build process. This way we actually ship
+          // a single CSS file in production instead of JS code injecting <style>
+          // tags. If you use code splitting, however, any async bundles will still
+          // use the "style" loader inside the async code so CSS from them won't be
+          // in the main CSS file.
           {
-            loader: require.resolve('less-loader'),
+            test: /\.css$/,
+            loader: ExtractTextPlugin.extract(
+              Object.assign(
+                {
+                  fallback: require.resolve('style-loader'),
+                  use: [
+                    {
+                      loader: require.resolve('css-loader'),
+                      options: {
+                        importLoaders: 1,
+                        minimize: true,
+                        sourceMap: shouldUseSourceMap,
+                      },
+                    },
+                    {
+                      loader: require.resolve('postcss-loader'),
+                      options: {
+                        // Necessary for external CSS imports to work
+                        // https://github.com/facebookincubator/create-react-app/issues/2677
+                        ident: 'postcss',
+                        plugins: () => [
+                          require('postcss-flexbugs-fixes'),
+                          autoprefixer({
+                            browsers: [
+                              '>1%',
+                              'last 4 versions',
+                              'Firefox ESR',
+                              'not ie < 9', // React doesn't support IE8 anyway
+                            ],
+                            flexbox: 'no-2009',
+                          }),
+                        ],
+                      },
+                    },
+                  ],
+                },
+                extractTextPluginOptions
+              )
+            ),
+            // Note: this won't work without `new ExtractTextPlugin()` in `plugins`.
+          },
+          {
+            test: /\.(svg)$/i,
+            loader: 'svg-sprite-loader',
+            include: [
+              require.resolve('antd-mobile').replace(/warn\.js$/, ''),  // 1. svg files of antd-mobile
+              path.resolve(__dirname, '../src/'),  // folder of svg files in your project
+            ]
+          },
+          {
+            test: /\.less$/,
+            use: [
+              require.resolve('style-loader'),
+              require.resolve('css-loader'),
+              {
+                loader: require.resolve('postcss-loader'),
+                options: {
+                  ident: 'postcss', // https://webpack.js.org/guides/migrating/#complex-options
+                  plugins: () => [
+                    autoprefixer({
+                      browsers: ['last 2 versions', 'Firefox ESR', '> 1%', 'ie >= 8', 'iOS >= 8', 'Android >= 4'],
+                    }),
+                    pxtorem({ rootValue: 100, propWhiteList: [] })
+                  ],
+                },
+              },
+              {
+                loader: require.resolve('less-loader'),
+                options: {
+                  modifyVars: { "@primary-color": "#1DA57A" },
+                },
+              },
+            ],
+          },
+          // "file" loader makes sure assets end up in the `build` folder.
+          // When you `import` an asset, you get its filename.
+          // This loader don't uses a "test" so it will catch all modules
+          // that fall through the other loaders.
+          {
+            loader: require.resolve('file-loader'),
+            // Exclude `js` files to keep "css" loader working as it injects
+            // it's runtime that would otherwise processed through "file" loader.
+            // Also exclude `html` and `json` extensions so they get processed
+            // by webpacks internal loaders.
+            exclude: [/\.js$/, /\.html$/, /\.json$/, /\.svg$/, /\.less/],
             options: {
-              modifyVars: { "@primary-color": "#1DA57A" },
+              name: 'static/media/[name].[hash:8].[ext]',
             },
           },
+          // ** STOP ** Are you adding a new loader?
+          // Make sure to add the new loader(s) before the "file" loader.
         ],
       },
     ],
@@ -300,8 +305,11 @@ module.exports = {
       },
       output: {
         comments: false,
+        // Turned on because emoji and regex is not minified properly using default
+        // https://github.com/facebookincubator/create-react-app/issues/2488
+        ascii_only: true,
       },
-      sourceMap: true,
+      sourceMap: shouldUseSourceMap,
     }),
     // Note: this won't work without ExtractTextPlugin.extract(..) in `loaders`.
     new ExtractTextPlugin({
@@ -327,6 +335,11 @@ module.exports = {
           // This message occurs for every build and is a bit too noisy.
           return;
         }
+        if (message.indexOf('Skipping static resource') === 0) {
+          // This message obscures real errors so we ignore it.
+          // https://github.com/facebookincubator/create-react-app/issues/2612
+          return;
+        }
         console.log(message);
       },
       minify: true,
@@ -337,9 +350,6 @@ module.exports = {
       navigateFallbackWhitelist: [/^(?!\/__).*/],
       // Don't precache sourcemaps (they're large) and build asset manifest:
       staticFileGlobsIgnorePatterns: [/\.map$/, /asset-manifest\.json$/],
-      // Work around Windows path issue in SWPrecacheWebpackPlugin:
-      // https://github.com/facebookincubator/create-react-app/issues/2235
-      stripPrefix: paths.appBuild.replace(/\\/g, '/') + '/',
     }),
     // Moment.js is an extremely popular library that bundles large locale files
     // by default due to how Webpack interprets its code. This is a practical
@@ -351,6 +361,7 @@ module.exports = {
   // Some libraries import Node modules but don't use them in the browser.
   // Tell Webpack to provide empty mocks for them so importing them works.
   node: {
+    dgram: 'empty',
     fs: 'empty',
     net: 'empty',
     tls: 'empty',
diff --git a/create-react-app/config/webpackDevServer.config.js b/create-react-app/config/webpackDevServer.config.js
index 6563fb8..0fb049d 100644
--- a/create-react-app/config/webpackDevServer.config.js
+++ b/create-react-app/config/webpackDevServer.config.js
@@ -1,6 +1,6 @@
 'use strict';
 
-const errorOverlayMiddleware = require('react-error-overlay/middleware');
+const errorOverlayMiddleware = require('react-dev-utils/errorOverlayMiddleware');
 const noopServiceWorkerMiddleware = require('react-dev-utils/noopServiceWorkerMiddleware');
 const config = require('./webpack.config.dev');
 const paths = require('./paths');
@@ -26,8 +26,8 @@ module.exports = function(proxy, allowedHost) {
     // So we will disable the host check normally, but enable it if you have
     // specified the `proxy` setting. Finally, we let you override it if you
     // really know what you're doing with a special environment variable.
-    disableHostCheck: !proxy ||
-      process.env.DANGEROUSLY_DISABLE_HOST_CHECK === 'true',
+    disableHostCheck:
+      !proxy || process.env.DANGEROUSLY_DISABLE_HOST_CHECK === 'true',
     // Enable gzip compression of generated files.
     compress: true,
     // Silence WebpackDevServer's own logs since they're generally not useful.
diff --git a/create-react-app/package.json b/create-react-app/package.json
index 945a85d..c92e16d 100644
--- a/create-react-app/package.json
+++ b/create-react-app/package.json
@@ -1,53 +1,49 @@
 {
-  "name": "webtest",
+  "name": "create-react-app",
   "version": "0.1.0",
   "private": true,
   "dependencies": {
-    "antd-mobile": "^1.1.3",
-    "react": "^15.5.4",
-    "react-dom": "^15.5.4"
-  },
-  "devDependencies": {
-    "autoprefixer": "7.1.0",
-    "babel-core": "6.24.1",
+    "antd-mobile": "^1.6.5",
+    "babel-plugin-import": "^1.2.0",
+    "less-loader": "^4.0.4",
+    "postcss-pxtorem": "^4.0.1",
+    "svg-sprite-loader": "^0.3.1",
+    "autoprefixer": "7.1.2",
+    "babel-core": "6.25.0",
     "babel-eslint": "7.2.3",
     "babel-jest": "20.0.3",
-    "babel-loader": "7.0.0",
-    "babel-plugin-import": "^1.2.0",
-    "babel-preset-react-app": "^3.0.0",
-    "babel-runtime": "6.23.0",
-    "case-sensitive-paths-webpack-plugin": "1.1.4",
+    "babel-loader": "7.1.1",
+    "babel-preset-react-app": "^3.0.2",
+    "babel-runtime": "6.26.0",
+    "case-sensitive-paths-webpack-plugin": "2.1.1",
     "chalk": "1.1.3",
-    "css-loader": "0.28.1",
+    "css-loader": "0.28.4",
     "dotenv": "4.0.0",
-    "eslint": "3.19.0",
-    "eslint-config-react-app": "^1.0.4",
-    "eslint-loader": "1.7.1",
-    "eslint-plugin-flowtype": "2.33.0",
-    "eslint-plugin-import": "2.2.0",
-    "eslint-plugin-jsx-a11y": "5.0.3",
-    "eslint-plugin-react": "7.0.1",
-    "extract-text-webpack-plugin": "2.1.0",
-    "file-loader": "0.11.1",
+    "eslint": "4.4.1",
+    "eslint-config-react-app": "^2.0.0",
+    "eslint-loader": "1.9.0",
+    "eslint-plugin-flowtype": "2.35.0",
+    "eslint-plugin-import": "2.7.0",
+    "eslint-plugin-jsx-a11y": "5.1.1",
+    "eslint-plugin-react": "7.1.0",
+    "extract-text-webpack-plugin": "3.0.0",
+    "file-loader": "0.11.2",
     "fs-extra": "3.0.1",
-    "html-webpack-plugin": "2.28.0",
-    "jest": "20.0.3",
-    "less": "^2.7.2",
-    "less-loader": "^4.0.4",
+    "html-webpack-plugin": "2.29.0",
+    "jest": "20.0.4",
     "object-assign": "4.1.1",
-    "postcss-flexbugs-fixes": "3.0.0",
-    "postcss-loader": "2.0.5",
-    "postcss-pxtorem": "^4.0.1",
-    "promise": "7.1.1",
-    "react-dev-utils": "^3.0.0",
-    "react-error-overlay": "^1.0.7",
-    "style-loader": "0.17.0",
-    "svg-sprite-loader": "^0.3.1",
-    "sw-precache-webpack-plugin": "0.9.1",
-    "url-loader": "0.5.8",
-    "webpack": "2.6.1",
-    "webpack-dev-server": "2.4.5",
-    "webpack-manifest-plugin": "1.1.0",
+    "postcss-flexbugs-fixes": "3.2.0",
+    "postcss-loader": "2.0.6",
+    "promise": "8.0.1",
+    "react": "^15.6.1",
+    "react-dev-utils": "^4.0.0",
+    "react-dom": "^15.6.1",
+    "style-loader": "0.18.2",
+    "sw-precache-webpack-plugin": "0.11.4",
+    "url-loader": "0.5.9",
+    "webpack": "3.5.1",
+    "webpack-dev-server": "2.7.1",
+    "webpack-manifest-plugin": "1.2.1",
     "whatwg-fetch": "2.0.3"
   },
   "scripts": {
@@ -78,7 +74,15 @@
     ],
     "moduleNameMapper": {
       "^react-native$": "react-native-web"
-    }
+    },
+    "moduleFileExtensions": [
+      "web.js",
+      "js",
+      "json",
+      "web.jsx",
+      "jsx",
+      "node"
+    ]
   },
   "babel": {
     "presets": [
diff --git a/create-react-app/public/favicon.ico b/create-react-app/public/favicon.ico
index 5c125de5d897c1ff5692a656485b3216123dcd89..a11777cc471a4344702741ab1c8a588998b1311a 100644
GIT binary patch
literal 3870
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
baj7?x%VD!5Cxk2YbYLNVeiXvvpMCWYo=by@

literal 24838
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
F{{x|jBbfjI

diff --git a/create-react-app/public/index.html b/create-react-app/public/index.html
index 5d5a9d6..7bee027 100644
--- a/create-react-app/public/index.html
+++ b/create-react-app/public/index.html
@@ -2,6 +2,7 @@
 <html lang="en">
   <head>
     <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
     <meta name="theme-color" content="#000000">
     <!--
       manifest.json provides metadata used when your web app is added to the
@@ -19,10 +20,6 @@
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
     <title>React App</title>
-    <script>
-      !function(e){function t(a){if(i[a])return i[a].exports;var n=i[a]={exports:{},id:a,loaded:!1};return e[a].call(n.exports,n,n.exports,t),n.loaded=!0,n.exports}var i={};return t.m=e,t.c=i,t.p="",t(0)}([function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=window;t["default"]=i.flex=function(e,t){var a=e||100,n=t||1,r=i.document,o=navigator.userAgent,d=o.match(/Android[\S\s]+AppleWebkit\/(\d{3})/i),l=o.match(/U3\/((\d+|\.){5,})/i),c=l&&parseInt(l[1].split(".").join(""),10)>=80,p=navigator.appVersion.match(/(iphone|ipad|ipod)/gi),s=i.devicePixelRatio||1;p||d&&d[1]>534||c||(s=1);var u=1/s,m=r.querySelector('meta[name="viewport"]');m||(m=r.createElement("meta"),m.setAttribute("name","viewport"),r.head.appendChild(m)),m.setAttribute("content","width=device-width,user-scalable=no,initial-scale="+u+",maximum-scale="+u+",minimum-scale="+u),r.documentElement.style.fontSize=a/2*s*n+"px"},e.exports=t["default"]}]);
-flex(100, 1);
-    </script>
   </head>
   <body>
     <noscript>
diff --git a/create-react-app/scripts/build.js b/create-react-app/scripts/build.js
index d9c14cd..5709f48 100644
--- a/create-react-app/scripts/build.js
+++ b/create-react-app/scripts/build.js
@@ -24,11 +24,17 @@ const checkRequiredFiles = require('react-dev-utils/checkRequiredFiles');
 const formatWebpackMessages = require('react-dev-utils/formatWebpackMessages');
 const printHostingInstructions = require('react-dev-utils/printHostingInstructions');
 const FileSizeReporter = require('react-dev-utils/FileSizeReporter');
+const printBuildError = require('react-dev-utils/printBuildError');
 
-const measureFileSizesBeforeBuild = FileSizeReporter.measureFileSizesBeforeBuild;
+const measureFileSizesBeforeBuild =
+  FileSizeReporter.measureFileSizesBeforeBuild;
 const printFileSizesAfterBuild = FileSizeReporter.printFileSizesAfterBuild;
 const useYarn = fs.existsSync(paths.yarnLockFile);
 
+// These sizes are pretty large. We'll warn for bundles exceeding them.
+const WARN_AFTER_BUNDLE_GZIP_SIZE = 512 * 1024;
+const WARN_AFTER_CHUNK_GZIP_SIZE = 1024 * 1024;
+
 // Warn and crash if required files are missing
 if (!checkRequiredFiles([paths.appHtml, paths.appIndexJs])) {
   process.exit(1);
@@ -66,7 +72,13 @@ measureFileSizesBeforeBuild(paths.appBuild)
       }
 
       console.log('File sizes after gzip:\n');
-      printFileSizesAfterBuild(stats, previousFileSizes, paths.appBuild);
+      printFileSizesAfterBuild(
+        stats,
+        previousFileSizes,
+        paths.appBuild,
+        WARN_AFTER_BUNDLE_GZIP_SIZE,
+        WARN_AFTER_CHUNK_GZIP_SIZE
+      );
       console.log();
 
       const appPackage = require(paths.appPackageJson);
@@ -83,7 +95,7 @@ measureFileSizesBeforeBuild(paths.appBuild)
     },
     err => {
       console.log(chalk.red('Failed to compile.\n'));
-      console.log((err.message || err) + '\n');
+      printBuildError(err);
       process.exit(1);
     }
   );
@@ -100,9 +112,19 @@ function build(previousFileSizes) {
       }
       const messages = formatWebpackMessages(stats.toJson({}, true));
       if (messages.errors.length) {
+        // Only keep the first error. Others are often indicative
+        // of the same problem, but confuse the reader with noise.
+        if (messages.errors.length > 1) {
+          messages.errors.length = 1;
+        }
         return reject(new Error(messages.errors.join('\n\n')));
       }
-      if (process.env.CI && messages.warnings.length) {
+      if (
+        process.env.CI &&
+        (typeof process.env.CI !== 'string' ||
+          process.env.CI.toLowerCase() !== 'false') &&
+        messages.warnings.length
+      ) {
         console.log(
           chalk.yellow(
             '\nTreating warnings as errors because process.env.CI = true.\n' +
diff --git a/create-react-app/src/App.css b/create-react-app/src/App.css
index fdd98ad..15adfdc 100644
--- a/create-react-app/src/App.css
+++ b/create-react-app/src/App.css
@@ -4,18 +4,18 @@
 
 .App-logo {
   animation: App-logo-spin infinite 20s linear;
-  height: 160px;
+  height: 80px;
 }
 
 .App-header {
   background-color: #222;
-  height: 300px;
-  padding: 40px;
+  height: 150px;
+  padding: 20px;
   color: white;
 }
 
 .App-intro {
-  font-size: 40px;
+  font-size: large;
 }
 
 @keyframes App-logo-spin {
diff --git a/create-react-app/src/index.css b/create-react-app/src/index.css
index fb25168..b4cc725 100644
--- a/create-react-app/src/index.css
+++ b/create-react-app/src/index.css
@@ -2,5 +2,4 @@ body {
   margin: 0;
   padding: 0;
   font-family: sans-serif;
-  font-size: 24px;
 }
diff --git a/create-react-app/src/index.js b/create-react-app/src/index.js
index 53c7688..fae3e35 100644
--- a/create-react-app/src/index.js
+++ b/create-react-app/src/index.js
@@ -1,8 +1,8 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
+import './index.css';
 import App from './App';
 import registerServiceWorker from './registerServiceWorker';
-import './index.css';
 
 ReactDOM.render(<App />, document.getElementById('root'));
 registerServiceWorker();
diff --git a/create-react-app/src/registerServiceWorker.js b/create-react-app/src/registerServiceWorker.js
index 9966897..4a3ccf0 100644
--- a/create-react-app/src/registerServiceWorker.js
+++ b/create-react-app/src/registerServiceWorker.js
@@ -8,40 +8,97 @@
 // To learn more about the benefits of this model, read https://goo.gl/KwvDNy.
 // This link also includes instructions on opting out of this behavior.
 
+const isLocalhost = Boolean(
+  window.location.hostname === 'localhost' ||
+    // [::1] is the IPv6 localhost address.
+    window.location.hostname === '[::1]' ||
+    // 127.0.0.1/8 is considered localhost for IPv4.
+    window.location.hostname.match(
+      /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
+    )
+);
+
 export default function register() {
   if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
+    // The URL constructor is available in all browsers that support SW.
+    const publicUrl = new URL(process.env.PUBLIC_URL, window.location);
+    if (publicUrl.origin !== window.location.origin) {
+      // Our service worker won't work if PUBLIC_URL is on a different origin
+      // from what our page is served on. This might happen if a CDN is used to
+      // serve assets; see https://github.com/facebookincubator/create-react-app/issues/2374
+      return;
+    }
+
     window.addEventListener('load', () => {
       const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
-      navigator.serviceWorker
-        .register(swUrl)
-        .then(registration => {
-          registration.onupdatefound = () => {
-            const installingWorker = registration.installing;
-            installingWorker.onstatechange = () => {
-              if (installingWorker.state === 'installed') {
-                if (navigator.serviceWorker.controller) {
-                  // At this point, the old content will have been purged and
-                  // the fresh content will have been added to the cache.
-                  // It's the perfect time to display a "New content is
-                  // available; please refresh." message in your web app.
-                  console.log('New content is available; please refresh.');
-                } else {
-                  // At this point, everything has been precached.
-                  // It's the perfect time to display a
-                  // "Content is cached for offline use." message.
-                  console.log('Content is cached for offline use.');
-                }
-              }
-            };
-          };
-        })
-        .catch(error => {
-          console.error('Error during service worker registration:', error);
-        });
+
+      if (!isLocalhost) {
+        // Is not local host. Just register service worker
+        registerValidSW(swUrl);
+      } else {
+        // This is running on localhost. Lets check if a service worker still exists or not.
+        checkValidServiceWorker(swUrl);
+      }
     });
   }
 }
 
+function registerValidSW(swUrl) {
+  navigator.serviceWorker
+    .register(swUrl)
+    .then(registration => {
+      registration.onupdatefound = () => {
+        const installingWorker = registration.installing;
+        installingWorker.onstatechange = () => {
+          if (installingWorker.state === 'installed') {
+            if (navigator.serviceWorker.controller) {
+              // At this point, the old content will have been purged and
+              // the fresh content will have been added to the cache.
+              // It's the perfect time to display a "New content is
+              // available; please refresh." message in your web app.
+              console.log('New content is available; please refresh.');
+            } else {
+              // At this point, everything has been precached.
+              // It's the perfect time to display a
+              // "Content is cached for offline use." message.
+              console.log('Content is cached for offline use.');
+            }
+          }
+        };
+      };
+    })
+    .catch(error => {
+      console.error('Error during service worker registration:', error);
+    });
+}
+
+function checkValidServiceWorker(swUrl) {
+  // Check if the service worker can be found. If it can't reload the page.
+  fetch(swUrl)
+    .then(response => {
+      // Ensure service worker exists, and that we really are getting a JS file.
+      if (
+        response.status === 404 ||
+        response.headers.get('content-type').indexOf('javascript') === -1
+      ) {
+        // No service worker found. Probably a different app. Reload the page.
+        navigator.serviceWorker.ready.then(registration => {
+          registration.unregister().then(() => {
+            window.location.reload();
+          });
+        });
+      } else {
+        // Service worker found. Proceed as normal.
+        registerValidSW(swUrl);
+      }
+    })
+    .catch(() => {
+      console.log(
+        'No internet connection found. App is running in offline mode.'
+      );
+    });
+}
+
 export function unregister() {
   if ('serviceWorker' in navigator) {
     navigator.serviceWorker.ready.then(registration => {

From c9a3a1607d206326820f5af9c916601ed4362c2b Mon Sep 17 00:00:00 2001
From: silentcloud <rjmuqiang@gmail.com>
Date: Wed, 30 Aug 2017 13:48:19 +0800
Subject: [PATCH 2/8] doc: update readme

---
 rn-expo/README.md    | 74 ++++++++++++++++++++++++++++++++++++++++++++
 rn-expo/package.json |  2 +-
 2 files changed, 75 insertions(+), 1 deletion(-)

diff --git a/rn-expo/README.md b/rn-expo/README.md
index a86eb38..fdb4f88 100644
--- a/rn-expo/README.md
+++ b/rn-expo/README.md
@@ -1 +1,75 @@
 # antd-mobile React-Native app for expo
+
+## How to use `antd-mobile` with create-react-native-app
+
+### Install and Initialization
+
+We need to install the appropriate tools first, you may need install [yarn](https://github.com/yarnpkg/yarn/) too.
+
+```bash
+$ npm install -g yarn
+$ npm install -g create-react-native-app
+```
+
+Then we create a new project named antm-demo.
+
+```bash
+$ create-react-native-app antm-demo
+```
+
+The tool will create and initialize environment and dependencies automaticly, please try config your proxy setting or use other npm registry if any network errors happen during it.
+
+Then we go inside antm-demo and start it.
+
+```bash
+$ cd antm-demo
+$ yarn start
+```
+
+Run `npm run ios` in terminal, it should be ok if you can see the page content in simulator.
+
+### Import antd-mobile
+
+First we install antd-mobile and [babel-plugin-import](https://github.com/ant-design/babel-plugin-import)(A babel plugin for importing components on demand [principle](https://github.com/ant-design/ant-design/blob/master/docs/react/getting-started#Import-on-Demand)) from yarn or npm.
+
+  ```bash
+  $ yarn add antd-mobile
+  $ yarn add babel-plugin-import --dev
+  ```
+
+1. Modify the `.babelrc` config, then restart the service.
+  
+  ```
+  --- a/.babelrc
+  +++ b/.babelrc
+  @@ -1,5 +1,6 @@
+   {
+     "presets": ["babel-preset-expo"],
+  +  "plugins": [["import", { "libraryName": "antd-mobile" }]],
+     "env": {
+       "development": {
+         "plugins": ["transform-react-jsx-source"]
+  ```
+    
+2. Modify the App.js file, import Button component from antd-mobile.
+
+  ```
+  --- a/App.js
+  +++ b/App.js
+  @@ -1,5 +1,7 @@
+   import React from 'react';
+   import { StyleSheet, Text, View } from 'react-native';
+  +import { Button } from 'antd-mobile';
+  +
+
+   export default class App extends React.Component {
+     render() {
+  @@ -8,6 +10,7 @@ export default class App extends React.Component {
+           <Text>Open up App.js to start working on your app!</Text>
+           <Text>Changes you make will automatically reload.</Text>
+           <Text>Shake your phone to open the developer menu.</Text>
+  +        <Button>antd-mobile button</Button>
+         </View>
+       );
+     }
+  ```
\ No newline at end of file
diff --git a/rn-expo/package.json b/rn-expo/package.json
index 23f684e..584025c 100644
--- a/rn-expo/package.json
+++ b/rn-expo/package.json
@@ -16,7 +16,7 @@
   "dependencies": {
     "antd-mobile": "^1.1.3",
     "antd-mobile-demo-data": "^0.1.4",
-    "expo": "^17.0.0",
+    "expo": "~17.0.0",
     "react": "16.0.0-alpha.6",
     "react-dom": "^15.0.0",
     "react-native": "^0.44.0",

From aa7826a95d3837921d72b7e50b12d86b42d8de6b Mon Sep 17 00:00:00 2001
From: paranoidjk <hust2012jiangkai@gmail.com>
Date: Wed, 6 Sep 2017 16:34:01 +0800
Subject: [PATCH 3/8] fix: start error. up deps.

---
 antd-antm/package.json                      |  8 ++++----
 antd-mobile-web/package.json                |  4 ++--
 antm-roadhog/package.json                   |  6 +++---
 create-react-app/package.json               |  4 ++--
 create-react-native-app/package.json        |  4 ++--
 react-native/package.json                   |  6 +++---
 rn-custom-ui/package.json                   |  4 ++--
 rn-expo/package.json                        |  6 +++---
 web-custom-ui-pro/package.json              | 12 ++++++------
 web-custom-ui/package.json                  | 14 +++++++-------
 web-dvajs/package.json                      |  6 +++---
 web-performance/package.json                |  8 ++++----
 web-qa/package.json                         |  8 ++++----
 web-typescript/package.json                 | 13 +++++++------
 web-typescript/src/components/TsExample.tsx |  2 +-
 web-typescript/webpack.config.js            | 14 ++++++++++++--
 web-webpack-pro/package.json                |  8 ++++----
 web-webpack/package.json                    |  8 ++++----
 web-webpack2/package.json                   |  6 +++---
 19 files changed, 76 insertions(+), 65 deletions(-)

diff --git a/antd-antm/package.json b/antd-antm/package.json
index 6b31f5e..033a3ad 100644
--- a/antd-antm/package.json
+++ b/antd-antm/package.json
@@ -14,11 +14,11 @@
     "start:mobile": "RUN_ENV=mobile dora --plugins \"proxy,webpack,livereload?enableJs=false&injectHost=127.0.0.1\""
   },
   "dependencies": {
-    "antd-mobile": "^1.0.0",
+    "antd-mobile": "1.x",
     "antd": "^1.0.0",
     "babel-runtime": "6.x",
-    "react": "15.3.x",
-    "react-dom": "15.3.x"
+    "react": "^15.6.1",
+    "react-dom": "^15.6.1"
   },
   "devDependencies": {
     "atool-build": "^0.9.0",
@@ -41,4 +41,4 @@
   "pre-commit": [
     "lint"
   ]
-}
+}
\ No newline at end of file
diff --git a/antd-mobile-web/package.json b/antd-mobile-web/package.json
index 17dae2d..a78c62c 100644
--- a/antd-mobile-web/package.json
+++ b/antd-mobile-web/package.json
@@ -10,7 +10,7 @@
         "analyzer": "webpack --profile --json > dist/stats.json && webpack-bundle-analyzer dist/stats.json -m static -O -r dist/report.html"
     },
     "devDependencies": {
-        "antd-mobile": "^1.5.0",
+        "antd-mobile": "1.x",
         "antd-mobile-web": "^1.5.0",
         "babel-core": "^6.25.0",
         "babel-loader": "^7.1.1",
@@ -20,4 +20,4 @@
         "webpack-bundle-analyzer": "^2.8.3",
         "webpack-dev-server": "^2.5.1"
     }
-}
+}
\ No newline at end of file
diff --git a/antm-roadhog/package.json b/antm-roadhog/package.json
index 37b577e..11156e0 100644
--- a/antm-roadhog/package.json
+++ b/antm-roadhog/package.json
@@ -11,12 +11,12 @@
   },
   "theme": "./theme.config.js",
   "dependencies": {
-    "antd-mobile": "^1.0.3",
+    "antd-mobile": "1.x",
     "babel-runtime": "^6.9.2",
     "dva": "^1.2.1",
     "rc-form": "^1.3.0",
-    "react": "^15.4.0",
-    "react-dom": "^15.4.0"
+    "react": "^15.6.1",
+    "react-dom": "^15.6.1"
   },
   "devDependencies": {
     "babel-eslint": "^7.1.1",
diff --git a/create-react-app/package.json b/create-react-app/package.json
index c92e16d..401576c 100644
--- a/create-react-app/package.json
+++ b/create-react-app/package.json
@@ -3,7 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
-    "antd-mobile": "^1.6.5",
+    "antd-mobile": "1.x",
     "babel-plugin-import": "^1.2.0",
     "less-loader": "^4.0.4",
     "postcss-pxtorem": "^4.0.1",
@@ -92,4 +92,4 @@
   "eslintConfig": {
     "extends": "react-app"
   }
-}
+}
\ No newline at end of file
diff --git a/create-react-native-app/package.json b/create-react-native-app/package.json
index ee6e681..619d1fb 100644
--- a/create-react-native-app/package.json
+++ b/create-react-native-app/package.json
@@ -20,9 +20,9 @@
     "preset": "jest-expo"
   },
   "dependencies": {
-    "antd-mobile": "^1.1.3",
+    "antd-mobile": "1.x",
     "expo": "^17.0.0",
     "react": "16.0.0-alpha.6",
     "react-native": "^0.44.0"
   }
-}
+}
\ No newline at end of file
diff --git a/react-native/package.json b/react-native/package.json
index cb145d2..d0086b0 100644
--- a/react-native/package.json
+++ b/react-native/package.json
@@ -7,8 +7,8 @@
     "test": "jest"
   },
   "dependencies": {
-    "antd-mobile": "~1.0.0",
-    "react": "~15.4.0-rc.4",
+    "antd-mobile": "1.x",
+    "react": "^15.6.1",
     "react-native": "0.40.0"
   },
   "devDependencies": {
@@ -21,4 +21,4 @@
   "jest": {
     "preset": "react-native"
   }
-}
+}
\ No newline at end of file
diff --git a/rn-custom-ui/package.json b/rn-custom-ui/package.json
index 4809354..6e8a6cb 100644
--- a/rn-custom-ui/package.json
+++ b/rn-custom-ui/package.json
@@ -10,7 +10,7 @@
 	},
 	"dependencies": {
     "antd-mobile": "~2.0.0-alpha.4",
-		"react": "~15.4.0",
+    "react": "^15.6.1",
 		"react-native": "0.41.2"
 	},
 	"devDependencies": {
@@ -23,4 +23,4 @@
 	"jest": {
 		"preset": "react-native"
 	}
-}
+}
\ No newline at end of file
diff --git a/rn-expo/package.json b/rn-expo/package.json
index 584025c..a9c795b 100644
--- a/rn-expo/package.json
+++ b/rn-expo/package.json
@@ -14,12 +14,12 @@
     "ios": "react-native-scripts ios"
   },
   "dependencies": {
-    "antd-mobile": "^1.1.3",
+    "antd-mobile": "1.x",
     "antd-mobile-demo-data": "^0.1.4",
     "expo": "~17.0.0",
     "react": "16.0.0-alpha.6",
-    "react-dom": "^15.0.0",
+    "react-dom": "^15.6.1",
     "react-native": "^0.44.0",
     "react-navigation": "^1.0.0-beta.11"
   }
-}
+}
\ No newline at end of file
diff --git a/web-custom-ui-pro/package.json b/web-custom-ui-pro/package.json
index 894327a..d4b8bb0 100644
--- a/web-custom-ui-pro/package.json
+++ b/web-custom-ui-pro/package.json
@@ -14,15 +14,15 @@
   ],
   "license": "MIT",
   "dependencies": {
-    "antd-mobile": "~1.0.0",
+    "antd-mobile": "1.x",
     "classnames": "^2.2.5",
     "lodash.throttle": "^4.1.1",
     "moment": "^2.14.1",
     "rc-steps": "^2.2.0"
   },
   "devDependencies": {
-    "@types/react": "^15.0.0",
-    "@types/react-dom": "~0.14.18",
+    "@types/react": "~16.0.2",
+    "@types/react-dom": "15.5.1",
     "antd": "2.x",
     "antd-mobile-demo-data": "^0.1.1",
     "antd-tools": "^0.16.1",
@@ -64,11 +64,11 @@
     "qrcode.react": "^0.6.1",
     "querystring": "^0.2.0",
     "rc-form": "1.x",
-    "react": "~15.4.1",
+    "react": "^15.6.1",
     "react-addons-test-utils": "^15.2.0",
     "react-copy-to-clipboard": "^4.0.1",
     "react-document-title": "^2.0.1",
-    "react-dom": "~15.4.1",
+    "react-dom": "^15.6.1",
     "react-github-button": "^0.1.9",
     "react-intl": "^2.2.3",
     "react-stateless-wrapper": "~1.0.2",
@@ -95,4 +95,4 @@
   },
   "typings": "lib/index.web.d.ts",
   "theme": "./theme.js"
-}
+}
\ No newline at end of file
diff --git a/web-custom-ui/package.json b/web-custom-ui/package.json
index 7b1fa6e..de5294f 100644
--- a/web-custom-ui/package.json
+++ b/web-custom-ui/package.json
@@ -15,13 +15,13 @@
   "license": "MIT",
   "main": "lib/warn.js",
   "dependencies": {
-    "antd-mobile": "^1.0.0",
+    "antd-mobile": "1.x",
     "classnames": "^2.2.5",
     "object-assign": "~4.1.0"
   },
   "devDependencies": {
-    "@types/react": "^15.0.0",
-    "@types/react-dom": "~0.14.18",
+    "@types/react": "~16.0.2",
+    "@types/react-dom": "15.5.1",
     "antd": "2.x",
     "antd-mobile-demo-data": "^0.1.1",
     "antd-tools": "^0.16.1",
@@ -62,17 +62,17 @@
     "rc-queue-anim": "^0.11.12",
     "rc-scroll-anim": "~0.3.0",
     "rc-tween-one": "~0.6.20",
-    "react": "^15.4.2",
+    "react": "^15.6.1",
     "react-addons-test-utils": "^15.2.0",
     "react-copy-to-clipboard": "^4.0.1",
     "react-document-title": "^2.0.1",
-    "react-dom": "^15.4.2",
+    "react-dom": "^15.6.1",
     "react-github-button": "^0.1.9",
     "react-intl": "^2.0.1",
     "react-stateless-wrapper": "~1.0.2",
     "reqwest": "~2.0.5",
     "svg-sprite-loader": "0.0.31",
-    "typescript": "~2.1.6"
+    "typescript": "~2.4.0"
   },
   "scripts": {
     "lint": "npm run tslint && npm run srclint && npm run demolint && npm run lesshint",
@@ -104,4 +104,4 @@
     "lint"
   ],
   "theme": "./theme.js"
-}
+}
\ No newline at end of file
diff --git a/web-dvajs/package.json b/web-dvajs/package.json
index c50b35a..843bb7b 100644
--- a/web-dvajs/package.json
+++ b/web-dvajs/package.json
@@ -4,7 +4,7 @@
     "index": "./src/index.js"
   },
   "dependencies": {
-    "antd-mobile": "^1.0.0",
+    "antd-mobile": "1.x",
     "babel-plugin-import": "^1.1.0",
     "dva": "~1.1.0"
   },
@@ -21,8 +21,8 @@
     "dora-plugin-webpack-hmr": "^0.2.1",
     "expect": "^1.20.2",
     "postcss-pxtorem": "~3.3.1",
-    "react": "~15.4.1",
-    "react-dom": "~15.4.1",
+    "react": "^15.6.1",
+    "react-dom": "^15.6.1",
     "redbox-react": "^1.3.2",
     "svg-sprite-loader": "^0.2.0"
   },
diff --git a/web-performance/package.json b/web-performance/package.json
index 2dbec1e..75acfbd 100644
--- a/web-performance/package.json
+++ b/web-performance/package.json
@@ -8,7 +8,7 @@
   },
   "license": "MIT",
   "dependencies": {
-    "antd-mobile": "^1.0.0",
+    "antd-mobile": "1.x",
     "babel-runtime": "^6.11.6",
     "moment": "^2.14.1",
     "rc-form": "^0.17.2"
@@ -32,9 +32,9 @@
     "postcss": "^5.2.5",
     "postcss-loader": "^1.1.0",
     "postcss-pxtorem": "^3.3.1",
-    "react": "^15.4.2",
+    "react": "^15.6.1",
     "react-addons-perf": "^15.4.2",
-    "react-dom": "^15.4.2",
+    "react-dom": "^15.6.1",
     "style-loader": "^0.12.4",
     "svg-sprite-loader": "^0.2.0",
     "url-loader": "^0.5.7",
@@ -42,4 +42,4 @@
     "webpack-dev-middleware": "^1.6.1",
     "webpack-dev-server": "^1.16.2"
   }
-}
+}
\ No newline at end of file
diff --git a/web-qa/package.json b/web-qa/package.json
index b82a855..859637f 100644
--- a/web-qa/package.json
+++ b/web-qa/package.json
@@ -8,7 +8,7 @@
   },
   "license": "MIT",
   "dependencies": {
-    "antd-mobile": "^1.0.0",
+    "antd-mobile": "1.x",
     "babel-runtime": "^6.11.6",
     "moment": "^2.14.1",
     "rc-form": "^0.17.2",
@@ -32,12 +32,12 @@
     "postcss": "^5.2.5",
     "postcss-loader": "^1.1.0",
     "postcss-pxtorem": "^3.3.1",
-    "react": "^15.4.2",
-    "react-dom": "^15.4.2",
+    "react": "^15.6.1",
+    "react-dom": "^15.6.1",
     "style-loader": "^0.12.4",
     "svg-sprite-loader": "^0.2.0",
     "url-loader": "^0.5.7",
     "webpack": "^1.13.1",
     "webpack-dev-server": "^1.16.2"
   }
-}
+}
\ No newline at end of file
diff --git a/web-typescript/package.json b/web-typescript/package.json
index 8bd7864..20c5700 100644
--- a/web-typescript/package.json
+++ b/web-typescript/package.json
@@ -7,12 +7,12 @@
   },
   "license": "ISC",
   "dependencies": {
-    "antd-mobile": "^1.3.0",
+    "antd-mobile": "1.x",
     "babel-runtime": "^6.20.0"
   },
   "devDependencies": {
-    "@types/react": "~0.14.55",
-    "@types/react-dom": "~0.14.19",
+    "@types/react": "~16.0.2",
+    "@types/react-dom": "15.5.1",
     "autoprefixer": "~6.5.4",
     "babel-core": "^6.25.0",
     "babel-loader": "~6.2.9",
@@ -31,11 +31,12 @@
     "postcss": "~5.2.6",
     "postcss-loader": "~1.2.1",
     "postcss-pxtorem": "~3.3.1",
-    "react": "~15.4.1",
-    "react-dom": "~15.4.1",
+    "react": "^15.6.1",
+    "react-dom": "^15.6.1",
     "source-map-loader": "~0.1.5",
+    "svg-sprite-loader": "^0.3.1",
     "ts-loader": "^1.3.2",
-    "typescript": "~2.1.4",
+    "typescript": "~2.4.0",
     "url-loader": "~0.5.7",
     "webpack": "^1.14.0",
     "webpack-dev-server": "~1.16.2"
diff --git a/web-typescript/src/components/TsExample.tsx b/web-typescript/src/components/TsExample.tsx
index ba0ed5d..47cbc4c 100644
--- a/web-typescript/src/components/TsExample.tsx
+++ b/web-typescript/src/components/TsExample.tsx
@@ -26,4 +26,4 @@ export class TsExample extends React.Component<HelloProps, {}> {
         </Accordion>
     </div>);
   }
-}
+}
\ No newline at end of file
diff --git a/web-typescript/webpack.config.js b/web-typescript/webpack.config.js
index 599cdd2..c3f0c68 100644
--- a/web-typescript/webpack.config.js
+++ b/web-typescript/webpack.config.js
@@ -5,6 +5,11 @@ const ExtractTextPlugin = require('extract-text-webpack-plugin');
 const autoprefixer = require('autoprefixer');
 const pxtorem = require('postcss-pxtorem');
 
+const svgDirs = [
+  require.resolve('antd-mobile').replace(/warn\.js$/, ''),  // 1. 属于 antd-mobile 内置 svg 文件
+  // path.resolve(__dirname, 'src/my-project-svg-foler'),  // 2. 自己私人的 svg 存放目录
+];
+
 module.exports = {
   devtool: "source-map",
   devServer: {
@@ -29,7 +34,12 @@ module.exports = {
       { test: /\.tsx?$/, loaders: [require.resolve('babel-loader'), require.resolve('ts-loader')] },
       { test: /\.css$/, loader: ExtractTextPlugin.extract('css?sourceMap!postcss-loader') },
       { test: /\.less$/, loader: ExtractTextPlugin.extract('css?sourceMap!postcss-loader!less?sourceMap') },
-      { test: /\.(jpg|png|svg)$/, loader: "url?limit=8192" }, //把不大于8kb的图片打包处理成Base64
+      { test: /\.(jpg|png)$/, loader: "url?limit=8192" }, //把不大于8kb的图片打包处理成Base64
+      {
+        test: /\.(svg)$/i,
+        loader: 'svg-sprite',
+        include: svgDirs,  // 把 svgDirs 路径下的所有 svg 文件交给 svg-sprite-loader 插件处理
+      },
     ],
     preLoaders: [
       // All output '.js' files will have any sourcemaps re-processed by 'source-map-loader'.
@@ -51,4 +61,4 @@ module.exports = {
     new ExtractTextPlugin('bundle.css', { disable: false, allChunks: true }),
     new webpack.optimize.OccurenceOrderPlugin(),
   ],
-};
+};
\ No newline at end of file
diff --git a/web-webpack-pro/package.json b/web-webpack-pro/package.json
index 4d2038f..6581541 100644
--- a/web-webpack-pro/package.json
+++ b/web-webpack-pro/package.json
@@ -46,15 +46,15 @@
     "webpack-dev-server": "^1.16.2"
   },
   "dependencies": {
-    "antd-mobile": "~1.0.4",
+    "antd-mobile": "1.x",
     "babel-polyfill": "^6.20.0",
     "dexie": "^1.5.1",
     "mobx": "^2.7.0",
     "mobx-react": "^4.0.3",
-    "react": "^15.4.1",
-    "react-dom": "^15.4.1",
+    "react": "^15.6.1",
+    "react-dom": "^15.6.1",
     "react-router": "^3.0.0",
     "sw-precache-webpack-plugin": "^0.7.1",
     "whatwg-fetch": "^2.0.1"
   }
-}
+}
\ No newline at end of file
diff --git a/web-webpack/package.json b/web-webpack/package.json
index d5fa5f6..baa70a9 100644
--- a/web-webpack/package.json
+++ b/web-webpack/package.json
@@ -8,7 +8,7 @@
   },
   "license": "MIT",
   "dependencies": {
-    "antd-mobile": "^1.2.0",
+    "antd-mobile": "1.x",
     "babel-runtime": "^6.11.6",
     "moment": "^2.14.1",
     "rc-form": "^0.17.2",
@@ -34,8 +34,8 @@
     "postcss": "^5.2.5",
     "postcss-loader": "^1.1.0",
     "postcss-pxtorem": "^3.3.1",
-    "react": "^15.4.2",
-    "react-dom": "^15.4.2",
+    "react": "^15.6.1",
+    "react-dom": "^15.6.1",
     "style-loader": "^0.12.4",
     "svg-sprite-loader": "^0.2.0",
     "url-loader": "^0.5.7",
@@ -44,4 +44,4 @@
     "webpack-dev-server": "^1.16.2",
     "webpack-visualizer-plugin": "^0.1.11"
   }
-}
+}
\ No newline at end of file
diff --git a/web-webpack2/package.json b/web-webpack2/package.json
index b761e34..a7d91a7 100644
--- a/web-webpack2/package.json
+++ b/web-webpack2/package.json
@@ -33,8 +33,8 @@
     "postcss": "^5.2.5",
     "postcss-loader": "^1.1.0",
     "postcss-pxtorem": "^3.3.1",
-    "react": "^15.4.2",
-    "react-dom": "^15.4.2",
+    "react": "^15.6.1",
+    "react-dom": "^15.6.1",
     "style-loader": "^0.12.4",
     "svg-sprite-loader": "^0.2.0",
     "url-loader": "^0.5.7",
@@ -43,4 +43,4 @@
     "webpack-dev-server": "^2.5.0",
     "webpack-visualizer-plugin": "^0.1.11"
   }
-}
+}
\ No newline at end of file

From 7e358e4fc87193103daf64a533baee5460ce33be Mon Sep 17 00:00:00 2001
From: paranoidjk <hust2012jiangkai@gmail.com>
Date: Wed, 6 Sep 2017 16:37:24 +0800
Subject: [PATCH 4/8] fix: host

---
 antd-mobile-web/README.md    | 4 ++--
 antd-mobile-web/package.json | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/antd-mobile-web/README.md b/antd-mobile-web/README.md
index 06ecd57..4ed50f8 100644
--- a/antd-mobile-web/README.md
+++ b/antd-mobile-web/README.md
@@ -9,7 +9,7 @@ npm install
 npm start
 ```
 
-open http://localhost:8080/
+open http://localhost:8000/
 
 ## Build
 
@@ -29,4 +29,4 @@ open http://localhost:8080/dist/report.html
 
 [antd-mobile](https://github.com/ant-design/ant-design-mobile) is React Native first library.
 
-[antd-mobile-web](https://github.com/cncolder/antd-mobile-web) make it easy for web developer.
+[antd-mobile-web](https://github.com/cncolder/antd-mobile-web) make it easy for web developer.
\ No newline at end of file
diff --git a/antd-mobile-web/package.json b/antd-mobile-web/package.json
index a78c62c..67050b8 100644
--- a/antd-mobile-web/package.json
+++ b/antd-mobile-web/package.json
@@ -5,7 +5,7 @@
     "description": "Ant design mobile web entry",
     "license": "MIT",
     "scripts": {
-        "start": "webpack-dev-server",
+        "start": "webpack-dev-server --host 0.0.0.0 --port 8000",
         "build": "webpack --progress --colors --display-reasons --display-used-exports --display-optimization-bailout",
         "analyzer": "webpack --profile --json > dist/stats.json && webpack-bundle-analyzer dist/stats.json -m static -O -r dist/report.html"
     },

From 1d139603de6c82c13cc9629d33d82a927b0bba63 Mon Sep 17 00:00:00 2001
From: silentcloud <rjmuqiang@gmail.com>
Date: Thu, 21 Sep 2017 15:25:00 +0800
Subject: [PATCH 5/8] docs: update 1.x doc for create-react-app

---
 create-react-app/README.md | 94 ++++++++++++++++++++------------------
 1 file changed, 50 insertions(+), 44 deletions(-)

diff --git a/create-react-app/README.md b/create-react-app/README.md
index 240dabe..2edcda3 100644
--- a/create-react-app/README.md
+++ b/create-react-app/README.md
@@ -31,71 +31,77 @@ Open browser at http://localhost:3000/, it renders a header saying "Welcome to R
 First we install antd-mobile and [babel-plugin-import](https://github.com/ant-design/babel-plugin-import)(A babel plugin for importing components on demand [principle](https://github.com/ant-design/ant-design/blob/master/docs/react/getting-started#Import-on-Demand)) from yarn or npm.
 
   ```bash
+  # you must run `eject` first
+  $ yarn run eject
   $ yarn add antd-mobile
   $ yarn add babel-plugin-import less-loader postcss-pxtorem svg-sprite-loader@0.3.1 --dev
   ```
 
 1. Modify `config/webpack.config.dev.js`
 
-    ```js
+    ```diff
+    + const pxtorem = require('postcss-pxtorem');
+    ...
     extensions: ['.web.js', '.js', '.json', '.jsx'],
     ...
     rules: [
-      {
-        exclude: [
-          ...
-          /\.less$/,
-          /\.svg$/,
-          ...
-        ]
-      },
       ...
       // Process JS with Babel.
       {
         test: /\.(js|jsx)$/,
         ...
         options: {
-          plugins: [
-            ['import', { libraryName: 'antd-mobile', style: true }],
-          ],
+    +     plugins: [
+    +       ['import', { libraryName: 'antd-mobile', style: true }],
+    +     ],
           cacheDirectory: true,
         }
       },
       ...
       // It is generally necessary to use the Icon component, need to configure svg-sprite-loader
+    + {
+    +  test: /\.(svg)$/i,
+    +  loader: 'svg-sprite-loader',
+    +  include: [
+    +    require.resolve('antd-mobile').replace(/warn\.js$/, ''),  // 1. svg files of antd-mobile
+    +    path.resolve(__dirname, '../src/'),  // folder of svg files in your project
+    +  ]
+    + },
+    + {
+    +  test: /\.less$/,
+    +  use: [
+    +    require.resolve('style-loader'),
+    +    require.resolve('css-loader'),
+    +    {
+    +      loader: require.resolve('postcss-loader'),
+    +      options: {
+    +        ident: 'postcss', // https://webpack.js.org/guides/migrating/#complex-options
+    +        plugins: () => [
+    +          autoprefixer({
+    +            browsers: ['last 2 versions', 'Firefox ESR', '> 1%', 'ie >= 8', 'iOS >= 8', 'Android >= 4'],
+    +          }),
+    +          pxtorem({ rootValue: 100, propWhiteList: [] })
+    +        ],
+    +      },
+    +    },
+    +    {
+    +      loader: require.resolve('less-loader'),
+    +      options: {
+    +        modifyVars: { "@primary-color": "#1DA57A" },
+    +      },
+    +    },
+    +  ],
+    + },
       {
-        test: /\.(svg)$/i,
-        loader: 'svg-sprite-loader',
-        include: [
-          require.resolve('antd-mobile').replace(/warn\.js$/, ''),  // 1. svg files of antd-mobile
-          // path.resolve(__dirname, 'src/my-project-svg-foler'),  // folder of svg files in your project
-        ]
-      },
-      {
-        test: /\.less$/,
-        use: [
-          require.resolve('style-loader'),
-          require.resolve('css-loader'),
-          {
-            loader: require.resolve('postcss-loader'),
-            options: {
-              ident: 'postcss', // https://webpack.js.org/guides/migrating/#complex-options
-              plugins: () => [
-                autoprefixer({
-                  browsers: ['last 2 versions', 'Firefox ESR', '> 1%', 'ie >= 8', 'iOS >= 8', 'Android >= 4'],
-                }),
-                pxtorem({ rootValue: 100, propWhiteList: [] })
-              ],
-            },
-          },
-          {
-            loader: require.resolve('less-loader'),
-            options: {
-              modifyVars: { "@primary-color": "#1DA57A" },
-            },
-          },
+        exclude: [
+          ...
+    +    /\.less$/,
+    +    /\.svg$/,
+          ...
         ],
-      }
+        loader: require.resolve('file-loader'),
+        ...
+      },
     ]
     ```
     > Note, we only modified webpack.config.dev.js now, if you wish this config working on production environment, you need to update webpack.config.prod.js as well.
@@ -110,4 +116,4 @@ First we install antd-mobile and [babel-plugin-import](https://github.com/ant-de
     if(!window.Promise) {
       document.writeln('<script src="https://as.alipayobjects.com/g/component/es6-promise/3.2.2/es6-promise.min.js"'+'>'+'<'+'/'+'script>');
     }
-    ```  
\ No newline at end of file
+    ```
\ No newline at end of file

From dd966c537e48652b58c4b05b74f22a0bcc7f3dbd Mon Sep 17 00:00:00 2001
From: silentcloud <rjmuqiang@gmail.com>
Date: Thu, 21 Sep 2017 16:12:50 +0800
Subject: [PATCH 6/8] fix: create-react-app doc link

---
 create-react-app/README.md         |  2 +-
 create-react-app/public/index.html | 14 +++++++++++++-
 create-react-app/src/App.css       |  2 +-
 3 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/create-react-app/README.md b/create-react-app/README.md
index 2edcda3..411cf07 100644
--- a/create-react-app/README.md
+++ b/create-react-app/README.md
@@ -108,7 +108,7 @@ First we install antd-mobile and [babel-plugin-import](https://github.com/ant-de
 
 2. Entry html page Required settings:
 
-  * Use HD program settings, see [antd-mobile-0.8-以上版本「高清」方案设置](https://github.com/ant-design/ant-design-mobile/wiki/antd-mobile-0.8-%E4%BB%A5%E4%B8%8A%E7%89%88%E6%9C%AC%E3%80%8C%E9%AB%98%E6%B8%85%E3%80%8D%E6%96%B9%E6%A1%88%E8%AE%BE%E7%BD%AE) for details.
+  * Use HD program settings, see [antd-mobile@0.8-1.x HD setting](https://github.com/ant-design/ant-design-mobile/wiki/HD) for details.
   * Use [FastClick](https://github.com/ftlabs/fastclick), ref [#576](https://github.com/ant-design/ant-design-mobile/issues/576)
   * Use Promise fallback support (some Android phones do not support Promise), as follows:
 
diff --git a/create-react-app/public/index.html b/create-react-app/public/index.html
index 7bee027..29ab7cf 100644
--- a/create-react-app/public/index.html
+++ b/create-react-app/public/index.html
@@ -2,7 +2,6 @@
 <html lang="en">
   <head>
     <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
     <meta name="theme-color" content="#000000">
     <!--
       manifest.json provides metadata used when your web app is added to the
@@ -20,6 +19,8 @@
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
     <title>React App</title>
+    <script>!function (e) { function t(a) { if (i[a]) return i[a].exports; var n = i[a] = { exports: {}, id: a, loaded: !1 }; return e[a].call(n.exports, n, n.exports, t), n.loaded = !0, n.exports } var i = {}; return t.m = e, t.c = i, t.p = "", t(0) }([function (e, t) { "use strict"; Object.defineProperty(t, "__esModule", { value: !0 }); var i = window; t["default"] = i.flex = function (e, t) { var a = e || 100, n = t || 1, r = i.document, o = navigator.userAgent, d = o.match(/Android[\S\s]+AppleWebkit\/(\d{3})/i), l = o.match(/U3\/((\d+|\.){5,})/i), c = l && parseInt(l[1].split(".").join(""), 10) >= 80, p = navigator.appVersion.match(/(iphone|ipad|ipod)/gi), s = i.devicePixelRatio || 1; p || d && d[1] > 534 || c || (s = 1); var u = 1 / s, m = r.querySelector('meta[name="viewport"]'); m || (m = r.createElement("meta"), m.setAttribute("name", "viewport"), r.head.appendChild(m)), m.setAttribute("content", "width=device-width,user-scalable=no,initial-scale=" + u + ",maximum-scale=" + u + ",minimum-scale=" + u), r.documentElement.style.fontSize = a / 2 * s * n + "px" }, e.exports = t["default"] }]);
+      flex(100, 1);</script>
   </head>
   <body>
     <noscript>
@@ -36,5 +37,16 @@
       To begin the development, run `npm start` or `yarn start`.
       To create a production bundle, use `npm run build` or `yarn build`.
     -->
+    <script src="https://as.alipayobjects.com/g/component/fastclick/1.0.6/fastclick.js"></script>
+    <script>
+      if ('addEventListener' in document) {
+        document.addEventListener('DOMContentLoaded', function () {
+          FastClick.attach(document.body);
+        }, false);
+      }
+      if (!window.Promise) {
+        document.writeln('<script src="https://as.alipayobjects.com/g/component/es6-promise/3.2.2/es6-promise.min.js"' + '>' + '<' + '/' + 'script>');
+      }
+    </script>
   </body>
 </html>
diff --git a/create-react-app/src/App.css b/create-react-app/src/App.css
index 15adfdc..f71c2d3 100644
--- a/create-react-app/src/App.css
+++ b/create-react-app/src/App.css
@@ -15,7 +15,7 @@
 }
 
 .App-intro {
-  font-size: large;
+  font-size: 24px;
 }
 
 @keyframes App-logo-spin {

From 9e4cb92b30c2da6fd1ea5ff4fb3b02afd6ac9fd2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=84=B6=E5=88=99?= <hualei.hl@alibaba-inc.com>
Date: Fri, 20 Oct 2017 13:13:32 +0800
Subject: [PATCH 7/8] up

---
 .gitignore                | 1 +
 antm-roadhog/package.json | 3 +--
 web-webpack2/package.json | 4 ++--
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/.gitignore b/.gitignore
index dc80ebc..91f32c2 100644
--- a/.gitignore
+++ b/.gitignore
@@ -23,3 +23,4 @@ npm-debug.log
 dist
 yarn.lock
 **/.vscode
+package-lock.json
diff --git a/antm-roadhog/package.json b/antm-roadhog/package.json
index 11156e0..5f8ceeb 100644
--- a/antm-roadhog/package.json
+++ b/antm-roadhog/package.json
@@ -3,8 +3,7 @@
   "scripts": {
     "start": "roadhog server",
     "build": "roadhog build",
-    "lint": "eslint --ext .js src test",
-    "precommit": "npm run lint"
+    "lint": "eslint --ext .js src test"
   },
   "engines": {
     "install-node": "6.9.2"
diff --git a/web-webpack2/package.json b/web-webpack2/package.json
index a7d91a7..050fa69 100644
--- a/web-webpack2/package.json
+++ b/web-webpack2/package.json
@@ -8,7 +8,7 @@
   },
   "license": "MIT",
   "dependencies": {
-    "antd-mobile": "^1.2.0",
+    "antd-mobile": "^1.7.1",
     "babel-runtime": "^6.11.6",
     "moment": "^2.14.1",
     "rc-form": "^0.17.2"
@@ -43,4 +43,4 @@
     "webpack-dev-server": "^2.5.0",
     "webpack-visualizer-plugin": "^0.1.11"
   }
-}
\ No newline at end of file
+}

From fb9c46c292ebd2dc64dc186ffa993d7581d43be7 Mon Sep 17 00:00:00 2001
From: silentcloud <rjmuqiang@gmail.com>
Date: Tue, 24 Oct 2017 18:24:36 +0800
Subject: [PATCH 8/8] chore: update 1.x theme, ref #40

---
 create-react-app/config/webpack.config.dev.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/create-react-app/config/webpack.config.dev.js b/create-react-app/config/webpack.config.dev.js
index adf103b..bc7e48e 100644
--- a/create-react-app/config/webpack.config.dev.js
+++ b/create-react-app/config/webpack.config.dev.js
@@ -241,7 +241,7 @@ module.exports = {
               {
                 loader: require.resolve('less-loader'),
                 options: {
-                  modifyVars: { "@primary-color": "#1DA57A" },
+                  modifyVars: { "@brand-primary": "#1DA57A" },
                 },
               },
             ],