VS代码:无法使用VS代码中的Webpack和Jsconfig解析模块的路径

时间:2019-03-17 03:03:02

标签: webpack visual-studio-code alias

我有一个用VS Code构建的React项目。我正在使用Webpack,所以我想添加一些别名:

module.exports = {
  resolve: {
    extensions: ['.js', '.jsx'],
    alias: {
      Config$: path.resolve(__dirname, 'config.js'),
      Css: path.resolve(__dirname, 'src/client/resources/css'),
      Client: path.resolve(__dirname, 'src/client')
    }
  }
// etc...  

因此,我引用了项目中的内容,例如在./src/client/index.js中:

import 'Css/util.scss';

项目按预期运行。 问题是,尽管我的项目根目录中存在jsconfig.json,但VS Code Intellisense无法识别别名:

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "Config": [
        "./config.js"
      ],
      "Css/*": [
        "./src/client/resources/css/*"
      ],
      "Client/*": [
        "./src/client/*"
      ],
    },
  },
  "exclude": [
    "node_modules",
    "dist"
  ]
}

尝试自动完成或导航到VS Code中使用别名加载的文件的位置失败,并且我的ESLint将该文件视为错误:

Error report

documentation for jsconfig in vscode说在“代码命令面板”中运行Reload JacaScript Project命令可能会解决此问题,但是我无法使用该命令。我正在跑步:

  

版本:1.32.3(用户设置)
  提交:a3db5be9b5c6ba46bb7555ec5d60178ecc2eaae4
  日期:2019-03-14T23:43:35.476Z
  电子:3.1.6
  铬:66.0.3359.181
  Node.js:10.2.0 V8:6.6.346.32操作系统:Windows_NT x64 10.0.17763

我研究了几个GitHub讨论,但都没有解决我的问题。

1 个答案:

答案 0 :(得分:0)

打开项目中的JavaScript文件后,便可以使用Reload JavaScript Project命令。显然,该命令仅在 .js .jsx 文件中可用。

但是,这仅在部分时间有效。通过停止我正在运行的项目并重新加载VSCode-Developer: Reload Window-我可以使IntelliSense和webpack项目都能正常工作。