账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    TypeScript,ts-loader转义错误的问题
    31
    0

    前几天有一个需求是这样的,需要创建一个长度为n的有序数组,像这样。

    [0,1,2,3,4,5,6,...]

    我这样实现的,。

    [...Array(10).keys()]

    然后在 TypeScript 的项目里就出错了。

    最后排查后发现是 ts-loader ,他在转义ES6的扩展运算符...的时候用slice方法实现的。
    但是 Array(10).keys() 得到的是一个数组的迭代器,迭代器上面是没有slice方法的,所以就报错了。

    这里是 TypeScript 官网对 [...Array(10).keys()] 的转义结果

    Array(10).keys().slice();

    这个是 babel 的转移结果

    "use strict";
    
    function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
    
    [].concat(_toConsumableArray(Array(10).keys()));

    可以看到他们的区别特别大的。

    这里该怎么配置 webpack 可以让 ts-loader 只是转义到 ES2015, 然后用 babel 再继续下面的转义?

    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 时光、生本性 普通会员 1楼

      在TypeScript中,当我们遇到转义错误时,可以使用typescript-plugin-checker-plugin这个插件来进行检查和修复。以下是一个简单的示例:

      首先,你需要在你的项目中安装这个插件:

      bash npm installtypescript-plugin-checker-plugin

      然后,你可以使用ts-loader来加载你的代码,然后使用typescript-plugin-checker-plugin来进行检查:

      ```typescript import { createChecker } from 'typescript-plugin-checker-plugin'; import * as path from 'path';

      const checker = createChecker({ use成果文件作为检出文件:true, use警告文件作为检出文件:true, use错误文件作为检出文件:true, use检查配置文件:true, use检查结果文件:true, use插件配置文件:true, use编译后的文件作为检出文件:true, use不支持的转换类型:true, });

      const filePath = path.resolve(__dirname, 'src', 'test.tsx');

      const rule = checker.checkFile(filePath);

      if (rule.exists) { console.log('没有错误'); } else { console.log('有错误'); } ```

      在这个示例中,我们首先创建了一个createChecker对象,然后设置了检查的配置。然后,我们检查了一个文件test.tsx,如果有错误,它会打印出错误信息。

      如果你的错误是由于JavaScript代码中的转义错误引起的,那么typescript-plugin-checker-plugin可能无法直接修复这些错误。你需要使用一个JavaScript解析器,如ESLint或JSLint,来检查你的JavaScript代码,然后再将结果转换为TypeScript代码。然后,你可以使用typescript-plugin-checker-plugin来进行检查。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部