typescript - Typescript & babel-plugin-module-resolver:VS Code 不解析导入
问题描述
我目前正在学习使用打字稿,但我遇到了 VS Code 的问题。我已经使用 Babel 7 和几个插件建立了一个基本项目。我使用命令npm run dev运行脚本。这是我的依赖项的完整列表:
//package.json
"scripts": {
"dev": "nodemon src/index.ts --extensions \".ts\" --exec babel-node"
},
"devDependencies": {
"@babel/cli": "^7.1.2",
"@babel/core": "^7.1.2",
"@babel/helper-plugin-utils": "^7.0.0",
"@babel/node": "^7.0.0",
"@babel/plugin-proposal-async-generator-functions": "^7.1.0",
"@babel/plugin-proposal-class-properties": "^7.1.0",
"@babel/plugin-proposal-decorators": "^7.1.2",
"@babel/plugin-proposal-optional-catch-binding": "^7.0.0",
"@babel/plugin-proposal-optional-chaining": "^7.0.0",
"@babel/plugin-transform-modules-commonjs": "^7.1.0",
"@babel/plugin-transform-typescript": "^7.1.0",
"babel-plugin-module-resolver": "^3.1.1"
}
以下是我的 2 个 .ts 文件的内容。
// src/script.ts
export default function (arg:string): string {
return arg;
};
// src/index.ts
import Fn from "@/script";
console.log( Fn("Hello World") );
这是我的 Babel 配置文件:
//babel.config.js
module.exports = {
"plugins": [
["@babel/plugin-transform-typescript"],
["@babel/plugin-transform-modules-commonjs"],
["@babel/plugin-proposal-async-generator-functions"],
["@babel/plugin-proposal-optional-catch-binding"],
["@babel/plugin-proposal-optional-chaining"],
["@babel/plugin-proposal-decorators", { "legacy": true }],
["@babel/plugin-proposal-class-properties", { "loose": true }],//must be after @babel/plugin-proposal-decorators
["module-resolver", {
//"root": ["./src", "./test"],
"alias": {
//"__root": ".",
"@": "./src",
//"#": "./src/assets",
//"_": "./src/assets/_",
//"!": "./static"
},
}]
]
};
还有我的 Typescript 配置文件:
// tsconfig.json
{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"@": ["./src"]
}
}
}
当我运行这段代码时,它看起来不错,我在控制台中看到“Hello World”。但是,VS Code 似乎不理解路径"@/script"。它带有红色下划线,并带有一个工具提示,上面写着
[ts] 找不到模块“@/script”。
如果我不使用 babel-plugin-module-resolver 插件,而是使用路径“./script”,我就没有这个问题。有没有办法解决这个问题?
谢谢!
解决方案
推荐阅读
- java - 如何正确编译/打包 Spring Cloud Data Flow 的任务
- python - 如何在列表中获取本地最小值?
- android - 使用 Resharp 访问本地服务器
- visual-studio-code - 需要在 Visual Studio 代码中移动智能感知弹出窗口
- php - 如何将一个或多个回声放在另一个回声中?
- cplex - 运行 OPL 几个小时但没有结果
- amazon-web-services - API Gateway 阶段变量始终为空
- python - 删除字段中的花括号
- consul - Consul KV 存储端点
- cobol - Abend u4038 将值从 1 个变量移动到具有不同图片子句的另一个变量时出错