Question

我一直在尝试使用Bitsrc在多个应用程序中共享前端组件。我能够创建组件并将其导出到bitsrc，但是在尝试导入和使用它们时遇到错误。

我已经使用Typescript和RequireJS用au new建立了一个新的aurelia应用程序。然后，我创建了一个仅包含纯HTML的简单组件。

- src
| - components
  | - rocketship
    | - rocketship.ts
    | - rocketship.html
    | - index.ts

当使用bit build和打字稿编译器（@0.0.5）来构建此组件时，index.js.map会编译为以下内容：

{"version":3,"file":"module.js","sourceRoot":"","sources":["module.tsx"],"names":[],"mappings":";;AAAA,2CAAsC;AAA7B,kCAAA,SAAO,EAAA"}

这引用了一个module.js文件，该文件未在任何地方定义，这使我相信这是导致我遇到的问题的原因。

当我通过NPM安装该组件并将其添加到aurelia.json时，如下所示：

{
  "name": "@bit/user.workspace.components.rocketship",
  "path": "../node_modules/@bit/user.workspace.components.rocketship/dist",
  "main": "index"
}

然后使用au run -w运行该应用程序，我收到错误消息：

Error: An error occurred while trying to read the map file at C:\Git\Aurelia test application\node_modules\@bit\user.workspace.components.rocketship\dist\module.js.map
Error: ENOENT: no such file or directory, open 'C:\Git\Aurelia test application\node_modules\@bit\user.workspace.components.rocketship\dist\module.js.map'
    at readFromFileMap (C:\Git\Aurelia test application\node_modules\aurelia-cli\lib\build\convert-source-map\index.js:32:11)
    at new Converter (C:\Git\Aurelia test application\node_modules\aurelia-cli\lib\build\convert-source-map\index.js:39:32)
    at Object.exports.fromMapFileComment (C:\Git\Aurelia test application\node_modules\aurelia-cli\lib\build\convert-source-map\index.js:112:10)
    at Object.exports.fromMapFileSource (C:\Git\Aurelia test application\node_modules\aurelia-cli\lib\build\convert-source-map\index.js:131:22)
    at acquireSourceMapForDependency (C:\Git\Aurelia test application\node_modules\aurelia-cli\lib\build\bundle.js:184:33)
    at work.then (C:\Git\Aurelia test application\node_modules\aurelia-cli\lib\build\bundle.js:206:25)
    at <anonymous>

因此，Aurelia CLI正在尝试读取组件文件夹中的文件module.js.map，该文件不存在。 Typescript编译器有问题吗？还是Aurelia无法处理转码后的结果？

我正在使用的转译器是

bit.envs/compilers/typescript@0.0.5

Answer 1

当前的打字稿编译器正在使用硬编码配置，前提是您正在使用以下命令：https://bitsrc.io/bit/envs/compilers/typescript/code 如果您想配置compilerOptions，则需要派生组件并按您希望的方式进行配置。

Fork意味着导入组件，进行更改，标记并导出到新的作用域。

Answer 2

问题在于，您使用的Bit环境具有自己的配置，该配置与项目中的设置不同。这是因为目前Bit带有其自己的一组硬编码配置。

以下是建议的工作流程，用于分叉和重新配置现有的Bit环境：

使用bit init
导入要修改的环境（但不带--compiler / tester标志）
打开并修改组件的配置文件
标记组件的新版本并将其导出到您自己的范围

现在您有了自己的编译器，其中包含一组修改的插件。下一步是回到您的项目，并修改bit.json文件以指向新的编译器。然后重新运行bit status，以查看所有组件现在都已修改（由于修改后的编译器）。使用新的编译器标记并导出新版本。

Bitsrc：Typescript Transpiler创建对module.js.map的引用

2 个答案: