企业🤖AI Agent构建引擎,智能编排和调试,一键部署,支持私有化部署方案 广告
## react 1、安装`react`。 `npm install --save react react-dom` react已经把基础代码和操作dom的代码分开了,所以安装使用react必须安装这两个包。 2、修改 `src/index.js`使用`react`。 ~~~ import React from 'react' // 为了能编写JSX代码 import ReactDOM from 'react-dom' // 为了使用render方法 ReactDOM.render(<div> Hello,React! </div>, document.getElementById('app)) ~~~ 3、执行打包命令 `webpack --config webpack.dev.config.js` 打开`index.html`可以看到效果(很简单)。 4、下面来把`<div> Hello,React! </div>`放到组件里面,简单的来看看什么叫组件化。 ~~~ cd src && mkdir components cd components mkdir Hello cd Hello touch Hello.js ~~~ 5、遵循React语法,写一个Hello组件 ~~~ import React, { Component } from 'react' // 如果不引入Component,就使用React.Component /* 使用类定义组件 */ export default class Hello extends Component { render() { return ( <div> Hello, React! </div> ) } } ~~~ 6、然后修改`src/index.js`,引入Hello组件。 ~~~ /* src/index.js */ import React from 'react' import ReactDOM from 'react-dom' import Hello from './components/Hello/Hello' ReactDOM.render(<Hello />, document.getElementById('app)) ~~~ 在任意目录都可以执行打包命令 7、执行打包命令 `webpack --config webpack.dev.config.js` 打开`index.html`看效果。