vscode生成react结构快捷键

插件:

 

1.rfc:函数式组件

import React from 'react'

export default function banner() {
  return (
    <div>
      
    </div>
  )
}

2.rcc:类组件

import React, { Component } from 'react'

export default class banner extends Component {
  render() {
    return (
      <div>
        
      </div>
    )
  }
}

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好的,以下是在 VSCode 中配置 React 环境的步骤: 1. 确认已安装 Node.js 和 npm。可以在终端输入以下命令进行确认: ``` node -v npm -v ``` 如果没有安装,可以去 Node.js 官网下载并安装。 2. 创建一个新的 React 应用程序。在终端中运行以下命令: ``` npx create-react-app my-app ``` 这将创建一个名为 `my-app` 的新 React 应用程序。 3. 打开 VSCode 并打开 `my-app` 文件夹。 4. 安装 VSCode 插件: - 安装 `ESLint` 插件:用于代码风格检查。 - 安装 `Prettier` 插件:用于代码格式化。 5. 在 VSCode 中打开终端(快捷键为 `Ctrl + Shift + `)并运行以下命令: ``` npm install ``` 这将安装所有必要的依赖项。 6. 在 VSCode 中打开 `package.json` 文件,并添加以下代码: ```json "scripts": { "start": "react-scripts start", "build": "react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject" }, ``` 7. 在 VSCode 中打开 `src/index.js` 文件,并添加以下代码: ```javascript import React from 'react'; import ReactDOM from 'react-dom'; import App from './App'; ReactDOM.render(<App />, document.getElementById('root')); ``` 8. 在 VSCode 中打开 `src/App.js` 文件,并修改为以下代码: ```javascript import React from 'react'; function App() { return ( <div className="App"> <h1>Hello, World!</h1> </div> ); } export default App; ``` 9. 在 VSCode 中打开终端并运行以下命令: ``` npm start ``` 这将启动 React 应用程序并在浏览器中打开它。 至此,你已经成功配置了 React 环境并创建了一个简单的 React 应用程序。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值