我希望我的项目包括Webpack resolve.alias选项,因此我将其添加到我的webpack.common.js配置文件中。
一开始我遇到了很多问题,但在搜索网络和许多GitHub Issues之后,我找到了一些帖子,这些帖子帮助我解决了我的问题。
导入工作了,但是我的问题是Visual Studios IntelliSense无法使用我的已声明的别名。我的设置:
我的项目目录:
+src
-first
-second
+third
| -third-one
| -third-two
| +third-three
| -third-three-one
-jsconfig.json
-.babelrc
-.eslintrc
-webpack.common.js
webpack.common.js
...
resolve: {
...
alias: {
first: path.resolve(__dirname, './first'),
second: path.resolve(__dirname, './second'),
third: path.resolve(__dirname, './third'),
common: path.resolve(__dirname, './third/third-three/third-three-one'),
},
},
...
.babelrc
{
"presets": ["es2015", "react", "airbnb"],
"plugins": [
["module-resolver", {
"alias": {
"first": "./first",
"second": "./second",
"third": "./third",
"common": "./third/third-three/third-three-one"
}
}]
]
}
jsconfig.json
...
"compilerOptions": {
"target": "es2015",
"module": "commonjs",
"allowSyntheticDefaultImports": true,
"baseUrl": ".",
"paths": {
"first": ["./first"],
"second": ["./second"],
"third": ["./third"],
"common": ["./third/third-three/third-three-one"],
}
},
...
.eslintrc
...
"settings": {
"import/resolver": {
"webpack": {
"config": "webpack.common.js"
},
"babel-module": {
"extensions": [".js", ".jsx"]
}
}
},
...
我在这个案例中使用的重要npm模块:
"webpack": "^2.6.1",
"eslint-import-resolver-babel-module": "^4.0.0",
"eslint-plugin-import": "^2.8.0",
"babel-plugin-module-resolver": "^3.0.0",
VS Code: 1.20
Windows 10
有人知道缺少什么吗?为什么 IntelliSense 没有触发?