VScode：如何从 jsconfig 快捷方式中指定的快捷方式路径自动完成 json/scss/image 文件路径答案

【问题标题】：VScode: How to autocomple json/scss/image file paths from shortcut paths specified in jsconfig shortcutsVScode：如何从 jsconfig 快捷方式中指定的快捷方式路径自动完成 json/scss/image 文件路径
【发布时间】：2021-03-07 12:50:25
【问题描述】：

在进行导入时，当我尝试导入 React .jsx 组件时，智能感知会建议自动完成名称。但是，当我尝试导入 json 或 scss 文件时，不会有任何建议。

我在webpack.config.js 中设置了一组别名

  resolve: {
    extensions: ['.css', '.js', '.jsx'],
    alias: {
      'src': path.resolve(__dirname + '/src'),
      'data': path.resolve(__dirname + '/src/data'),
      'assets': path.resolve(__dirname + '/src/assets'),
      'images': path.resolve(__dirname + '/src/assets/images'),
      'styles': path.resolve(__dirname + '/src/assets/styles'),
      'components': path.resolve(__dirname + '/src/components'),
      'types': path.resolve(__dirname + '/src/types'),
      'functions': path.resolve(__dirname + '/src/functions'),
      'pages': path.resolve(__dirname + '/src/pages')
    }
  },

因为我希望智能感知自动完成这些路径，所以我创建了一个 jsconfig.json

    {
        "compilerOptions": {
          "jsx": "react",
          "allowSyntheticDefaultImports": true,
          "target": "es6",
          "baseUrl": "./",
          "paths": {
            "src": ["./src"],
            "src/*": ["./src/*"],
            "data": ["./src/data"],
            "data/*": ["./src/data/*"],
            "assets": ["./src/assets"],
            "assets/*": ["./src/assets/*"],
            "images": ["./src/assets/images"],
            "images/*": ["./src/assets/images/*"],
            "styles": ["./src/assets/styles"],
            "styles/*": ["./src/assets/styles/*"],
            "components": ["./src/components"],
            "components/*": ["./src/components/*"],
            "types": ["./src/types"],
            "types/*": ["./src/types/*"],
            "functions": ["./src/functions"],
            "functions/*": ["./src/functions/*"],
            "pages": ["./src/pages"],
            "pages/*": ["./src/pages/*"],
          }
        },
        "exclude": ["node_modules"],
        "checkJs": "true"
      }

我安装了path intellisense

我的keybindings.json 也设置为

[
    { "key": ".", "command": "" }
]

我还按照路径智能感知文档中的建议将"typescript.suggest.paths": false 添加到我的.vscode/setting.json，尽管我不使用打字稿。这只是一个 javascript 项目。

【问题讨论】：

在这里寻找答案的cmets：stackoverflow.com/questions/56241357/…
你有什么扩展？我不确定，但我认为您可能需要一个 scss 扩展。
@Nailuj29 你知道是哪一个吗？
@AdamP。我可能有路径自动完成功能，它在我的工作计算机上，从 cmets 看起来它无论如何都不起作用。我想要的主要是 json 的智能感知，这样当我尝试使用 json 文件中的变量时可以自动完成
@Sam 对不起，我想我误解了你的问题。我不认为 VS Code 支持在带有 Intellisense 的 JSON 文件中使用变量。您可以只加载 JSON 文件并使用 JSON.parse 访问它。

标签： webpack visual-studio-code intellisense compiler-options vscode-jsconfig

【解决方案1】：

我必须添加

    "compilerOptions": {
        "resolveJsonModule": true,

到我的 jsconfig.json 获取 json

【讨论】：