react脚手架
程序员文章站
2024-02-26 21:03:10
...
脚手架
7-1.全局安装脚手架
全局安装: npm i create-react-app -g
查看版本: create-react-app -V
7-2.使用脚手架创建项目
1.create-react-app 项目名称
2.cd demo
3.npm start #项目启动
如果报错,如何解决
git add . #添加到暂存区
git commit -m 'tj' #提交代码至本地仓库
npm run eject #将项目全部依赖项导出 不可逆
npm start #正常启动
7-3.项目清空
src
App.jsx
import React from 'react'
export default function App() {
return (
<div>
REACT
</div>
)
}
index.js
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App.jsx';
ReactDOM.render(<App />,document.getElementById('root'));
其他渲染全部删除即可
7-4.项目目录
config: #项目的配置文件
public #公共资源文件包含唯一页面index.html
src: #你的代码
App.jsx #根组件
index.js #唯一入口文件
需要安装一个ES7 react/redux
imp: import xxx from '';
imn: import 'xxx';
rfc: 创建一个函数组件
rcc: 创建一个类组件
7-5.创建组件
import React, { Component } from 'react'
export default class Case extends Component {
render() {
return (
<div>
<h1>第一个组件</h1>
</div>
)
}
}
上一篇: React脚手架
下一篇: JSON Web Tokens的实现原理