我最近开始使用vs代码。我正在使用带有反应和类型脚本的材料ui。但是我无法使用alt(option)+输入快捷方式来导入材料ui的组件。我正在使用Mac,而我正在使用的打字稿版本是3.0.3。但是,我正在显式创建的react组件,我能够使用上述快捷方式导入的组件。以下是我正在使用的package.json:
{
"name": "portfolio",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"build": "webpack"
},
"author": "ahujru",
"license": "ISC",
"dependencies": {
"@material-ui/core": "3.0.3",
"@material-ui/icons": "3.0.1",
"@types/material-ui": "0.21.5",
"@types/react": "16.4.14",
"@types/react-dom": "16.0.7",
"awesome-typescript-loader": "5.2.1",
"css-loader": "1.0.0",
"node-sass": "4.9.3",
"react": "16.5.1",
"react-dom": "16.5.1",
"sass": "1.13.4",
"sass-loader": "7.1.0",
"source-map-loader": "0.2.4",
"style-loader": "0.23.0",
"typeface-roboto": "0.0.54",
"typescript": "3.0.3",
"webpack": "4.19.0",
"webpack-cli": "3.1.0",
"webpack-dev-server": "3.1.8"
}
}
和tsconfig.json:
{
"compilerOptions": {
"baseUrl": ".",
"module": "commonjs",
"watch": true,
"sourceMap": true,
"outDir": "target",
"target": "es6",
"jsx": "react",
"noImplicitAny": true,
"moduleResolution": "node"
},
"include": [
"./src/**/*"
],
"exclude": [
"node_modules"
]
}
我已经安装了npm intellisense,intellij键盘绑定和自动导入之类的插件,但似乎什么也没发生。有人可以告诉我我在这里想念什么。
我相信我可以重现您所遇到的问题。根据我的测试,VS Code内置的自动导入功能仅适用于在文件中定义的符号,这些符号 已经
匹配到或已由项目中的include
设置直接或间接导入,这些文件 已
作为项目的一部分加载到项目中tsconfig.json
。(有关某些背景,请参见此线程。)
我从您的配置文件和空白的源文件开始,但@types/material-ui
由于它是用于旧material-
ui
软件包(您尚未安装)的,所以将其删除了,这只会使您感到困惑。在这一点上,如果我调用代码完成用Ctrl-Space键,我 不
提供的材料UI组件(AppBar
,Avatar
,…)。但是,如果添加了一个导入(例如)import { AppBar } from
"@material-ui/core";
,它会强制TypeScript服务器加载@material-
ui/core
,那么现在,如果再次调用代码完成功能,我将获得其余的Material
UI组件。如果您需要自动导入才能在没有现有导入的情况下正常工作,则可以将适当的.d.ts
文件添加到中的include
列表中tsconfig.json
,尽管那样您想使用一个单独的tsconfig.json
文件进行批量编译,这样您就不会覆盖@material-
ui/core
包中的JavaScript文件。
我尚未测试任何第三方自动导入插件,也无法谈论它们的行为。