TS-45 宽松策略

原创
2020/11/17 22:49
阅读数 56

将js、jsx文件重命名为ts、tsx文件,并且使用最宽松的类型检查规则,在不修改代码的前提下,是我们的工程能够跑起来

一、重命名

  • 项目小,手动重名名就可以
  • 项目大,借助工具重命名
    • 使用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-js

这时,项目代码运行终端,出现报错,需要修改webpack配置

// 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文件,不修改原有的代码,只修改类型检查规则

展开阅读全文
打赏
0
0 收藏
分享
加载中
更多评论
打赏
0 评论
0 收藏
0
分享
返回顶部
顶部