Merge pull request #161 from umijs/improve-umi

Improve umi
umijs · Mar 6, 2018 · 2ba245b · 2ba245b
2 parents c26d0d3 + 8336672
commit 2ba245b
Show file tree

Hide file tree

Showing 11 changed files with 112 additions and 17 deletions.
diff --git a/examples/func-test/global.js b/examples/func-test/global.js
@@ -0,0 +1 @@
+console.log('global');
diff --git a/examples/func-test/pages/index.js b/examples/func-test/pages/index.js
@@ -1,5 +1,6 @@
 import { Button } from 'antd-mobile';
 import Link from 'umi/link';
+import router from 'umi/router';
 import styles from './index.less';
 
 export default function() {
@@ -20,7 +21,14 @@ export default function() {
           <Link to="/users/detail">go to /users/detail</Link>
         </li>
       </ul>
-      <Button type="primary">一个没啥用的 Button</Button>
+      <Button
+        type="primary"
+        onClick={() => {
+          router.push('/list');
+        }}
+      >
+        go to /list with router.push()
+      </Button>
     </div>
   );
 }
diff --git a/examples/func-test/public/dva.jpg b/examples/func-test/public/dva.jpg
diff --git a/examples/routes-via-config/_routes.json b/examples/routes-via-config/_routes.json
@@ -7,7 +7,6 @@
   },
   {
     "path": "/list",
-    "exact": true,
     "component": "./pages/b"
   },
   {

diff --git a/packages/af-webpack/src/getConfig.js b/packages/af-webpack/src/getConfig.js
@@ -384,6 +384,7 @@ export default function getConfig(opts = {}) {
             /\.json$/,
             /\.(js|jsx|ts|tsx)$/,
             /\.(css|less|scss|sass)$/,
+            ...(opts.urlLoaderExcludes || []),
           ],
           loader: require.resolve('url-loader'),
           options: {

diff --git a/packages/af-webpack/src/getUserConfig/configs/urlLoaderExcludes.js b/packages/af-webpack/src/getUserConfig/configs/urlLoaderExcludes.js
@@ -0,0 +1,13 @@
+import assert from 'assert';
+
+export default function() {
+  return {
+    name: 'urlLoaderExcludes',
+    validate(val) {
+      assert(
+        Array.isArray(val),
+        `The urlLoaderExcludes config must be Array, but got ${val}`,
+      );
+    },
+  };
+}
diff --git a/packages/umi-build-dev/src/FilesGenerator.js b/packages/umi-build-dev/src/FilesGenerator.js
@@ -81,8 +81,9 @@ export default class FilesGenerator {
         },
       });
 
-      // rebuild 时只生成 router.js
       this.generateRouterJS();
+      this.generateEntry();
+
       if (this.onChange) this.onChange();
       if (this.hasRebuildError) {
         // 从出错中恢复时，刷新浏览器
@@ -101,11 +102,8 @@ export default class FilesGenerator {
     }
   }
 
-  generateFiles() {
+  generateEntry() {
     const { paths, entryJSTpl, config, libraryName } = this.service;
-    this.service.applyPlugins('generateFiles');
-
-    this.generateRouterJS();
 
     // Generate umi.js
     let entryContent = readFileSync(
@@ -134,6 +132,14 @@ if (process.env.NODE_ENV === 'production') {
       `;
     }
     writeFileSync(paths.absLibraryJSPath, entryContent, 'utf-8');
+  }
+
+  generateFiles() {
+    const { paths } = this.service;
+    this.service.applyPlugins('generateFiles');
+
+    this.generateRouterJS();
+    this.generateEntry();
 
     // Generate registerServiceWorker.js
     writeFileSync(
@@ -184,8 +190,8 @@ if (process.env.NODE_ENV === 'production') {
   getRouterContent() {
     const { routes, config, paths } = this.service;
 
-    const routesByPath = routes.reduce((memo, { path, component }) => {
-      memo[path] = component;
+    const routesByPath = routes.reduce((memo, route) => {
+      memo[route.path] = route;
       return memo;
     }, {});
 
@@ -202,7 +208,8 @@ if (process.env.NODE_ENV === 'production') {
       )}').default,`;
     }
     let routesContent = Object.keys(routesByPath).map(key => {
-      const pageJSFile = winPath(relative(paths.tmpDirPath, routesByPath[key]));
+      const route = routesByPath[key];
+      const pageJSFile = winPath(relative(paths.tmpDirPath, route.component));
       debug(`requested: ${JSON.stringify(getRequest())}`);
       const isDev = process.env.NODE_ENV === 'development';
 
@@ -218,7 +225,7 @@ if (process.env.NODE_ENV === 'production') {
           isCompiling = true;
         }
       } else {
-        webpackChunkName = normalizeEntry(routesByPath[key]);
+        webpackChunkName = normalizeEntry(route.component);
         component = `dynamic(() => import(/* webpackChunkName: '${webpackChunkName}' */'${pageJSFile}'), { ${loadingOpts} })`;
       }
       component = this.service.applyPlugins('modifyRouteComponent', {
@@ -231,7 +238,8 @@ if (process.env.NODE_ENV === 'production') {
         },
       });
 
-      return `    <Route exact path="${key}" component={${component}} />`;
+      const exact = route.exact ? 'exact ' : '';
+      return `    <Route ${exact}path="${key}" component={${component}} />`;
     });
 
     routesContent = this.service.applyPlugins('modifyRoutesContent', {

diff --git a/packages/umi-build-dev/src/HtmlGenerator.js b/packages/umi-build-dev/src/HtmlGenerator.js
@@ -72,14 +72,18 @@ export default class HtmlGenerator {
   getContent(opts = {}) {
     const { pageConfig = {}, route = {} } = opts;
     const { paths, webpackConfig } = this.service;
-    const { document, context } = pageConfig;
+    const { document, context = {} } = pageConfig;
 
     // e.g.
     // path: /user.html
     // component: ./user/page.js
     // entry: ./user
     const { path, component } = route;
 
+    if (!context.path) {
+      context.path = path;
+    }
+
     const customDocPath = document
       ? join(paths.cwd, document)
       : paths.absPageDocumentPath;
@@ -176,7 +180,7 @@ ${jsContent}
       process.env.COMPRESS !== 'none'
     ) {
       html = minify(html, {
-        removeAttributeQuotes: true,
+        removeAttributeQuotes: false, // site don't support no quote attributes
         collapseWhitespace: true,
       });
     }

diff --git a/packages/umi-build-dev/src/getPlugins.js b/packages/umi-build-dev/src/getPlugins.js
@@ -46,6 +46,7 @@ export default function(opts = {}) {
 
   // 内置插件
   const builtInPlugins = [
+    './plugins/global-js',
     './plugins/global-css',
     './plugins/layout',
     './plugins/fastclick',

diff --git a/packages/umi-build-dev/src/plugins/global-js.js b/packages/umi-build-dev/src/plugins/global-js.js
@@ -0,0 +1,33 @@
+import { join } from 'path';
+import { existsSync } from 'fs';
+
+export default function(api) {
+  const { paths } = api.service;
+
+  const globalFiles = [
+    join(paths.absSrcPath, 'global.tsx'),
+    join(paths.absSrcPath, 'global.ts'),
+    join(paths.absSrcPath, 'global.jsx'),
+    join(paths.absSrcPath, 'global.js'),
+  ];
+
+  function getGlobalJS() {
+    for (const file of globalFiles) {
+      if (existsSync(file)) {
+        return file;
+      }
+    }
+  }
+
+  api.register('modifyEntryFile', ({ memo }) => {
+    const globalJS = getGlobalJS();
+    if (globalJS) {
+      memo = `import '${globalJS}';\r\n${memo}`;
+    }
+    return memo;
+  });
+
+  api.register('modifyPageWatchers', ({ memo }) => {
+    return [...memo, ...globalFiles];
+  });
+}
diff --git a/packages/umi-build-dev/src/plugins/hd/index.js b/packages/umi-build-dev/src/plugins/hd/index.js
@@ -1,8 +1,25 @@
 import px2rem from 'postcss-plugin-px2rem';
 import { join } from 'path';
+import { existsSync } from 'fs';
 
 export default function(api) {
-  const { config, libraryName } = api.service;
+  const { config, paths } = api.service;
+
+  const hdFiles = [
+    join(paths.absSrcPath, 'hd.tsx'),
+    join(paths.absSrcPath, 'hd.ts'),
+    join(paths.absSrcPath, 'hd.jsx'),
+    join(paths.absSrcPath, 'hd.js'),
+  ];
+
+  function getHdJS() {
+    for (const file of hdFiles) {
+      if (existsSync(file)) {
+        return file;
+      }
+    }
+    return join(__dirname, './template/index.js');
+  }
 
   api.register('modifyConfigPlugins', ({ memo }) => {
     memo.push(api => {
@@ -29,9 +46,19 @@ export default function(api) {
           minPixelValue: 2,
         }),
       ];
-      const hdFile = join(__dirname, './template/index.js');
-      memo.entry[libraryName].unshift(hdFile);
       return memo;
     });
+
+    api.register('modifyEntryFile', ({ memo }) => {
+      const hdJS = getHdJS();
+      if (hdJS) {
+        memo = `import '${hdJS}';\r\n${memo}`;
+      }
+      return memo;
+    });
+
+    api.register('modifyPageWatchers', ({ memo }) => {
+      return [...memo, ...hdFiles];
+    });
   }
 }