我在 typescript 中使用 aurelia,我想避免使用像这样的相对导入路径:
import { DialogBox } from '../../resources/elements/dialog-box';
而是
import { DialogBox } from 'resources/elements/dialog-box';
我修改了 tsconfig.json 以便编译器通过添加 baseUrl 和 paths 来处理相对路径,如下所示:
"compilerOptions": {
"sourceMap": true,
"target": "es5",
"module": "amd",
"declaration": false,
"noImplicitAny": false,
"removeComments": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"moduleResolution": "node",
"lib": ["es2015", "dom"],
"baseUrl": ".",
"paths": {
"*":["src/*"]
}
}...
但是当我运行 cli 的命令“au run --watch”时,我可以看到所有步骤都运行良好,直到跟踪某些文件时失败的 writeBundle 步骤:
Starting 'processMarkup'...
Starting 'processCSS'...
Starting 'configureEnvironment'...
Finished 'configureEnvironment'
Starting 'buildTypeScript'...
Finished 'processCSS'
Finished 'processMarkup'
Finished 'buildTypeScript'
Starting 'writeBundles'...
该过程因以下错误而失败:
Tracing resources/elements/dialog-box...
{ uid: 11,
name: 'writeBundles',
branch: false,
error:
{ [Error: ENOENT: no such file or directory, open 'C:\...\src\resources\elements\dialog-box.js']
errno: -4058,
奇怪的是:还有其他文件是用非相对路径引用的,并且打包器没有失败。
还有一件奇怪的事情:如果我使用观察者离开相对路径和 bundle ,一切正常。然后,如果我从有问题的导入中删除相关的 '../../',我会收到 bundle 警告,但一切正常......
知道我可能做错了什么吗?
编辑更正:
我只是理解为什么有些文件似乎是 bundle 在一起的,而另一些却没有。我注意到所有没有失败的“root-relative”导入文件实际上是从其他具有相对路径的文件导入的。所以我想 bundler 是从那里找到它们的。这解决了一件事,但基本问题仍然存在:当存在“root-relative”导入时,aurelia-cli 无法 bundle ...
为解决方案编辑: 感谢下面思南博雷的解决方案,通过更新一些包解决了相对路径问题:
npm i -D gulp-typescript@^3.1.5 typings@^2.1.0 aurelia-tools@^1.0.0
我后来遇到的语义错误来自一些仍然安装但不需要的打字,以及将 typescript 作为本地 npm 包安装以及全局安装。 我卸载了它们,所有错误都消失了。
npm uninstall @types/es6-promise
npm uninstall @types/es6-collections
npm uninstall typescript
最佳答案
看看这个Gist example其中:
- 我在
src/lib/init.ts
中创建了一个类Init
- 我在
src/main.ts
中import init from 'lib/init'
没有相对路径 - 我将
main.ts
更改为import environment from 'environment'
而不是from './environment'
——这也有效。
使用 original tsconfig
generated by the CLI ,我的构建因错误而失败:
src/main.ts(3,18): error TS2307: Cannot find module 'lib/init'.
改成tsconfig
in my Gist后, 构建成功。
(无效)建议:
在tsconfig中,你能不能试试:
a) 在 compilerOptions.paths
中的 src
之前添加 ./
(这解决了我机器上的问题)
paths: {"*": ["./src/*"]}
^
b) 添加filesGlob
"filesGlob": [
"./src/**/*.ts",
"./test/**/*.ts",
"./typings/index.d.ts",
"./custom_typings/**/*.d.ts"
],
编辑:以前的建议没有用,更新包怎么样:
npm i -D gulp-typescript@^3.1.5 typings@^2.1.0 aurelia-tools@^1.0.0
在 https://github.com/aurelia/cli/issues/494#issuecomment-282103289 中查看结果
关于bundle - 使用相对导入路径时 Aurelia bundle 失败,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42411567/