vscode插件开发,如何使用绝对路径导入js模块?

作者站长头像
站长
· 阅读数 9

vscode插件开发,如何使用绝对路径导入js模块?

我尝试以绝对路径导入js模块,智能提示没有问题,但运行调试就报错,如何解决这个问题?以下是详情。

jsconfig.js配置代码如下

{
    "compilerOptions": {
        "module": "Node16",
        "target": "ES2022",
        "checkJs": true, 
        "lib": [
            "ES2022"
        ],
        "baseUrl": ".",
        "paths": {
            "@/*": ["./src/*"],
            
        }
    },
    "exclude": [
        "node_modules"
    ]
}

导入js模块代码内容,所在文件路径:src/util/TestUtil.js

let test={
    test123(){

    },
    test567(){

    }
}
module.exports= {

    test:test,
  };

以绝对路径导入,调用const TestUtil = require('@/util/TestUtil.js')代码导入,输入TestUtil加小数点,有智能提示的截图vscode插件开发,如何使用绝对路径导入js模块?

运行提示错误

Activating extension 'undefined_publisher.vscode-plugin-todo' failed: Cannot find module '@/util/TestUtil.js'
Require stack:
- e:\Workspace\vscodePlugins\vscode-plugin-todo\src\box\box.js
- e:\Workspace\vscodePlugins\vscode-plugin-todo\extension.js
- e:\Users\hasee\AppData\Local\Programs\Microsoft VS Code\resources\app\out\vs\loader.js
- e:\Users\hasee\AppData\Local\Programs\Microsoft VS Code\resources\app\out\bootstrap-amd.js
- e:\Users\hasee\AppData\Local\Programs\Microsoft VS Code\resources\app\out\bootstrap-fork.js
- .

如何解决这个问题

回复
1个回答
avatar
test
2024-06-20

jsconfig.js里面的paths只是让vscode能够识别你的路径别名,然后给你进行提示而已。这也就是为什么你会看到webpack中会下面这个配置的原因:

alias: {
  '@': path.resolve(__dirname, 'src'),
},

所以,你需要给你的构建流程中配置上路径别名,这样require在遇到@时才知道如何解析。

回复
likes
适合作为回答的
  • 经过验证的有效解决办法
  • 自己的经验指引,对解决问题有帮助
  • 遵循 Markdown 语法排版,代码语义正确
不该作为回答的
  • 询问内容细节或回复楼层
  • 与题目无关的内容
  • “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容