doc(umi-ui): improve tips when local umi's version does not match (umijs#3143)

sorrycc · web-flow · commit 1a25a8f82d29 · 2019-09-03T11:33:16.000+08:00
* doc(umi-ui): improve tips when local umi's version does not match

* update

* update

* update
diff --git a/docs/guide/faq.md b/docs/guide/faq.md
@@ -212,3 +212,14 @@ Why: umiJS SSR executes code first server-side, then client-side. The `document`
 
 1. you absolutely need to have access to it in some React component, you should put that code in `componentDidMount` or `useEffect`. This lifecycle method will only be executed on the client.
 1. add the judgment with something like `typeof navigator !== 'undefined'` or `typeof document !== 'undefined'`
+
+## UMI UI
+
+### Umi version is too low, please upgrade to umi@2.9 or above
+
+Umi UI 需要 umi@2.9 或以上，如果本地项目的版本不匹配，会报这个错误。
+
+解决方案就是升级到最新版。
+
+* 如果 package.json 中的 umi 依赖是能自动匹配到最新版的，比如 `^2.9` 或者 `2.x`，删除 `node_modules` 重装依赖即可
+* 如果 package.json 中的 umi 依赖不能匹配到最新版，比如 `~2.8` 或者 `2.8.0-beta.1`，那么需改成 `^2.9` 或其他能匹配到最新版的写法，然后删除 `node_modules` 再重装依赖
diff --git a/docs/zh/guide/faq.md b/docs/zh/guide/faq.md
@@ -212,3 +212,14 @@ export default Header;
 
 1. 建议将使用到客户端对象的代码，放在 `componentDidMount`、`useEffect` 中（服务端不会执行），避免过多副作用代码影响服务端渲染。
 1. 在这些对象前加上判断 `typeof navigator !== 'undefined'` 或 `typeof document !== 'undefined'`
+
+## UMI UI
+
+### Umi 版本过低，请升级到最新
+
+Umi UI 需要 umi@2.9 或以上，如果本地项目的版本不匹配，会报这个错误。
+
+解决方案就是升级到最新版。
+
+* 如果 package.json 中的 umi 依赖是能自动匹配到最新版的，比如 `^2.9` 或者 `2.x`，删除 `node_modules` 重装依赖即可
+* 如果 package.json 中的 umi 依赖不能匹配到最新版，比如 `~2.8` 或者 `2.8.0-beta.1`，那么需改成 `^2.9` 或其他能匹配到最新版的写法，然后删除 `node_modules` 再重装依赖
diff --git a/packages/umi-ui/client/src/locales/en-US.ts b/packages/umi-ui/client/src/locales/en-US.ts
@@ -2,7 +2,7 @@ export default {
   'org.umi.ui.version': 'Version',
   'org.umi.ui.loading.open': 'Loading',
   'org.umi.ui.loading.onloading': 'Running',
-  'org.umi.ui.loading.error': 'Failed to load',
+  'org.umi.ui.loading.error': 'Failed to Open Project',
   'org.umi.ui.loading.deps.installing': 'Installing',
   'org.umi.ui.global.delete.success': 'Delete success',
   'org.umi.ui.global.delete.failure': 'Delete failed',
diff --git a/packages/umi-ui/client/src/locales/zh-CN.ts b/packages/umi-ui/client/src/locales/zh-CN.ts
@@ -2,7 +2,7 @@ export default {
   'org.umi.ui.version': '版本',
   'org.umi.ui.loading.open': '正在打开项目',
   'org.umi.ui.loading.onloading': '执行中',
-  'org.umi.ui.loading.error': '加载失败',
+  'org.umi.ui.loading.error': '项目打开失败',
   'org.umi.ui.loading.deps.installing': '依赖安装中',
   'org.umi.ui.global.delete.success': '删除成功',
   'org.umi.ui.global.delete.failure': '删除失败',
diff --git a/packages/umi-ui/client/src/pages/loading/index.tsx b/packages/umi-ui/client/src/pages/loading/index.tsx
@@ -138,7 +138,7 @@ export default class Loading extends React.Component<ILoadingProps, ILoadingStat
 
     const renderSubTitle = error => (
       <div className={styles['loading-subTitle']}>
-        <p>{error.title}</p>
+        <p dangerouslySetInnerHTML={{ __html: error.title }} />
         {error.exception && (
           <div>
             联系{' '}
diff --git a/packages/umi-ui/src/UmiUI.ts b/packages/umi-ui/src/UmiUI.ts
@@ -148,17 +148,21 @@ export default class UmiUI {
       const binModule = process.env.BIGFISH_COMPAT
         ? '@alipay/bigfish/bin/bigfish.js'
         : 'umi/bin/umi.js';
+      const pkgModule = process.env.BIGFISH_COMPAT
+        ? '@alipay/bigfish/package.json'
+        : 'umi/package.json';
       const cwd = project.path;
       const localService = isDepFileExists(cwd, serviceModule);
       const localBin = isDepFileExists(cwd, binModule);
       if (process.env.UI_CHECK_LOCAL !== 'none' && localBin && !localService) {
         // 有 Bin 但没 Service，说明版本不够
+        const { version } = JSON.parse(readFileSync(join(cwd, 'node_modules', pkgModule), 'utf-8'));
         throw new ActiveProjectError({
           title: process.env.BIGFISH_COMPAT
-            ? `Bigfish 版本过低，请升级到 @alipay/bigfish@2.20 或以上。`
+            ? `本地项目的 Bigfish 版本（${version}）过低，请升级到 @alipay/bigfish@2.20 或以上，<a target="_blank" href="https://yuque.antfin-inc.com/bigfish/doc/uzfwoc#ff1deb63">查看详情</a>。`
             : {
-                'zh-CN': `Umi 版本过低，请升级到 umi@2.9 或以上。`,
-                'en-US': `Umi version is too low, please upgrade to umi@2.9 or above.`,
+                'zh-CN': `本地项目的 Umi 版本（${version}）过低，请升级到 umi@2.9 或以上，<a target="_blank" href="https://umijs.org/zh/guide/faq.html#umi-%E7%89%88%E6%9C%AC%E8%BF%87%E4%BD%8E%EF%BC%8C%E8%AF%B7%E5%8D%87%E7%BA%A7%E5%88%B0%E6%9C%80%E6%96%B0">查看详情</a>。`,
+                'en-US': `Umi version (${version}) of the project is too low, please upgrade to umi@2.9 or above, <a target="_blank" href="https://umijs.org/guide/faq.html#umi-version-is-too-low-please-upgrade-to-umi-2-9-or-above">view details</a>.`,
               },
           lang,
           actions: [ReInstallDependencyAction, OpenProjectAction, BackToHomeAction],
