fix(cli): 修改 tsconfig.json 默认模版，完善 config-detail/alias 部分文档 (#2219)

* tsconfig.json 默认模版增加 resolveJsonModule 选项 * 完善 config-detail 中 alias 部分的文档 * 文档勘误 * 为 mobx 和 redux 模版增加 resolveJsonModule 选项
NervJS · Feb 20, 2019 · 02cf7d3 · 02cf7d3
1 parent fe8c12e
commit 02cf7d3
Show file tree

Hide file tree

Showing 4 changed files with 32 additions and 5 deletions.
diff --git a/docs/config-detail.md b/docs/config-detail.md
@@ -102,24 +102,48 @@ defineConstants: {
 ```js
 import A from '../../componnets/A'
 import Utils from '../../utils'
+import packageJson from '../../package.json'
+import projectConfig from '../../project.config.json'
 ```
 
 为了避免书写多级相对路径，我们可以如下配置 `alias`：
 
 ```js
 alias: {
-  '@components': path.resolve(__dirname, '..', 'src/components'),
-  '@utils': path.resolve(__dirname, '..', 'src/utils')
+  '@/components': path.resolve(__dirname, '..', 'src/components'),
+  '@/utils': path.resolve(__dirname, '..', 'src/utils'),
+  '@/package': path.resolve(__dirname, '..', 'package.json'),
+  '@/project': path.resolve(__dirname, '..', 'project.config.json'),
 }
 ```
 
-通过上述配置，可以将 `src` 、`src/components` 以及 `src/utils` 目录配置成别名，则代码中的引用改写如下：
+通过上述配置，可以将 `src/components` 和 `src/utils` 目录配置成别名，将根目录下的 `package.json` 和 `project.config.json` 文件配置成别名，则代码中的引用改写如下：
 
 ```js
-import A from '@components/A'
-import Utils from '@utils'
+import A from '@/components/A'
+import Utils from '@/utils'
+import packageJson from '@/package'
+import projectConfig from '@/project'
 ```
 
+为了让编辑器（VS Code）不报错，并继续使用自动路径补全的功能，需要在项目根目录下的 `jsconfig.json` 或者 `tsconfig.json` 中配置 `paths` 让编辑器认得我们的别名，形式如下：
+
+```json
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@/components/*": ["./src/components/*"],
+      "@/utils/*": ["./src/utils/*"],
+      "@/package": ["./package.json"],
+      "@/project": ["./project.config.json"],
+    }
+  }
+}
+```
+
+*建议别名使用 `@/` 开头而非仅用 `@` 开头，因为有小概率会与某些 `scoped` 形式的 `npm` 包（行如：[@tarojs/taro](https://npm.im/@tarojs/taro), [@babel/core](https://npm.im/@babel/core)）产生命名冲突。*
+
 ## copy
 
 文件 copy 配置，包含两个配置项 `patterns` 和 `options`。

diff --git a/packages/taro-cli/templates/default/tsconfigjson b/packages/taro-cli/templates/default/tsconfigjson
@@ -18,6 +18,7 @@
     "jsx": "preserve",
     "jsxFactory": "Taro.createElement",
     "allowJs": true,
+    "resolveJsonModule": true,
     "typeRoots": [
       "node_modules/@types",
       "global.d.ts"

diff --git a/packages/taro-cli/templates/mobx/tsconfigjson b/packages/taro-cli/templates/mobx/tsconfigjson
@@ -18,6 +18,7 @@
     "jsx": "preserve",
     "jsxFactory": "Taro.createElement",
     "allowJs": true,
+    "resolveJsonModule": true,
     "typeRoots": [
       "node_modules/@types",
       "global.d.ts"

diff --git a/packages/taro-cli/templates/redux/tsconfigjson b/packages/taro-cli/templates/redux/tsconfigjson
@@ -18,6 +18,7 @@
     "jsx": "preserve",
     "jsxFactory": "Taro.createElement",
     "allowJs": true,
+    "resolveJsonModule": true,
     "typeRoots": [
       "node_modules/@types"
     ]