TS-45 寬鬆策略

將js、jsx文件重命名爲ts、tsx文件，而且使用最寬鬆的類型檢查規則，在不修改代碼的前提下，是咱們的工程可以跑起來node

1、重命名

項目小，手動重名名就能夠
項目大，藉助工具重命名
- 使用shelljs完成
  - 安裝shelljs等:

npm i shelljs @types/shelljs ts-node -D

- 編寫腳本:根目錄新建renameJS.ts

// renameJS.ts 作文件重命名工做

import * as shelljs from 'shelljs';

shelljs.find('src')
.filter(file => file.match(/\.jsx?$/))
.forEach(file => {
    const newName = file.replace(/\.j(sx?)$/, '.t$1');
    shelljs.mv(file, newName);
})

- package.json中編寫腳本

{
    scripts: {
        ...
        "rename-js": "ts-node renameJS.ts"
    }
}

運行該腳本:npm run rename-jswebpack

這時，項目代碼運行終端，出現報錯，須要修改webpack配置web

// webpack.base.config.js

module.exports = {
  entry: {
    //'app': './src/index.jsx',
    'app': './src/index.tsx',
  },
  ...
};

第二步，修改類型檢查規則

// tsconfig.json

{
    "compilerOptions": {
        ...
        /* a)註釋掉這兩個有關js的規則 */
        // "allowJs": true,
        // "checkJs": true,
        ...
        /* b)關閉對隱式any類型的檢查 */
        // "noImplicitAny": true,
        "noImplicitAny": false, // 容許有隱式any類型
        "strict": false, // 也能夠關閉類型嚴格檢查
        ...
        /* c)關閉額外檢查規則 */
        /* Additional Checks */
        "noUnusedLocals": false,
        "noUnusedParameters": false,
        "noImplicitReturns": false,
        "noFallthroughCasesInSwitch": true,
    },
    ...
}

寬鬆策略總結

它的原則就是，把js文件重命名爲ts文件，不修改原有的代碼，只修改類型檢查規則shell