Question

我确定我遗漏了一些简单的内容，但我无法让React.js IntelliSense在Visual Studio代码中运行。

我做了以下事情：

npm install typings
ext install Typings Installer
ext install Typings
typings init位于我的＆＃34; app＆＃34;
typings install --ambient react-global位于我的＆＃34; app＆＃34;
重新启动Visual Studio代码

他们创建了一个typings文件夹。我的应用程序采用以下文件夹结构：

├───public
│   ├───css
│   └───scripts
|       └───test.js
└───typings
    ├───browser
    │   └───ambient
    │       └───react-global
    └───main
        └───ambient
            └───react-global

然而，当我在test.js并输入React.时，我没有获得智能感知。

我认为我错过了一些基本的东西？

编辑：感谢您的帮助，它实际上再次参与其中。我想我有它工作并在这里写了我的步骤http://mattdufeu.co.uk/setup-intellisense-vscode-react-js/

Answer 1

我认为你需要将jsconfig.json添加到工作区的根目录

https://code.visualstudio.com/docs/languages/javascript#_javascript-projects-jsconfigjson

[注意：您甚至可以将jsconfig.json文件留空]

我有同样的角度问题，这解决了我。

希望这会有所帮助!!

Answer 2

现在不再推荐打字（以及tsd）。我发现我的情况的一行答案只是包含来自npm的类型定义和命令

npm i @types/react --save-dev

intellisense立即在Visual Studio Code中为我选择了新的定义，但也许对于其他人你可能需要重新启动你的VSCode窗口。

我不确定它是否相关，但我的应用是使用最新版本的create-react-app创建的。

Answer 3

如果其他人在2016年3月或4月遇到此问题，您可能还希望在github中检查此问题，看看它是否已关闭：

https://github.com/Microsoft/vscode-react-native/issues/61

基本上，使用import React, { Component } from 'react' ES6样式的模块导入会导致Salsa的Intellisense不起作用，解决方法是使用require：
var React = require('react'); var { Component } = React;

Answer 4

如果您将一个空的 jsconfig.json 文件添加到您的react项目，它将使构建过程崩溃。像这样填充

Answer 5

最后通过定义进入所有工作，并全部使用react jsx进行工作。您需要jsconfig.json，看起来像这样（请注意需要“ jsx”：“ react”属性，如果使用隐式类，请在别名中指定尾随的'index.jsx'-文件夹名称范例）：

{ 
    "compilerOptions": {
        "baseUrl": "./src",
        "paths": { 
            "shared/*":       ["./components/shared/*/index.jsx"],
            "components/*":   ["./components/*/index.jsx"],
            "stores/*":       ["./lib/stores/*"],
            "services/*":     ["./lib/services/*"],
            "utils/*":        ["./lib/utils/*"]
        },
        "module": "commonjs",
        "target": "es6",
        "moduleResolution": "classic",
        "jsx": "react"
    }
}

然后像这样的导入全部起作用：

import UserApi from 'services/api/UserApi';
import EditArea from 'components/views/Blog/EditArea';
import EditableLabel from 'shared/EditableLabel';

希望有帮助！

在Visual Studio代码中反应intellisense

5 个答案: