Сделать VS-код читать webpack.config и распознать путь с помощью псевдонима?

Я работаю с Webpack и Visual Studio Code и избегаю таких вещей, как:

import { AuthenticationService } from '../../../services/authentication/service';

Я создал псевдонимы на моем webpack.config, поэтому я могу использовать:

import { AuthenticationService } from 'services/authentication/service';

Однако, делая это, Visual Code не может обнаружить мой код, и поэтому я теряю intelisense для своих классов.

Есть ли у кого-нибудь решение для этого, есть ли способ заставить VS-код читать webpack.config и распознавать путь с псевдонимом?

заблаговременно

Ответы

Ответ 1

обновите [email protected], и вы можете отобразить те же псевдонимы веб-пакетов на tsconfig.json, добавив:

"compilerOptions": {
    "baseUrl": "./",
    "paths": {
      "app/*": ["src/app/*"]
    }
}

Ответ 2

У меня возникла аналогичная проблема. Поскольку я использовал javascript, а не typescript, мне пришлось создать файл jsconfig.json и использовать параметр paths соответствующим образом.

Предполагая структуру каталогов следующим образом:

.
├── src
│   ├── foo.js
│   ├── jsconfig.json # your vscode js config
│   └── my-module     # folder you're aliasing
│       └── bar.js
└── webpack.config.js # your webpack config

Это заработало для меня:

  • Настройте псевдоним решения webpack:

    var path = require('path');
    module.exports = {
      resolve: {
        alias: {
          "my-module": path.resolve(__dirname, './src/my-module')
        }
      },
      // ... other webpack options
    };
    
  • Измените jsconfig.json в папке src:

    {
      "compilerOptions": {
        "target": "es6",
        "paths": {
          "my-module": ["./my-module"]
        }
      }
    }
    
  • Используйте псевдоним:

    // in foo.js
    import Bar from 'my-module/bar';
    Bar.quack();
    

Ответ 3

Вам нужно указать поля paths и baseUrl в файле jsconfig.json.

{
    "compilerOptions": {
        "jsx": "react",
        "target": "ES6",
        "allowSyntheticDefaultImports": true,
        "baseUrl": "./",
        "paths": {
            "~/*": ["./app/*"]
        }
    },
    "exclude": [
        "node_modules"
    ]
}

См. документация по сопоставлению пути

Ответ 4

Я использую расширение VSCode PathIntellisense.

Настройте этот параметр в моем файле настроек VSCode.

Теперь VSCode может распознавать путь с псевдонимом.