DOM
操作
React
的核心是组件,组件的设计目的是提升代码的复用率、降低测试难度和代码复杂度。
JSX
语法,更直观的在js文件中看HTML
代码,提高可读性如果是要直接在
HTML
上编辑,需要下载react.js
与react-dom.js
。如果要使用JSX语法,则需要使用转换JSX
语法的插件。这里使用brower.js
。在线地址:https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js
react.js
:react
的核心库react-dom.js
:提供操作DOM
相关的功能brower,js
:将使用的JSX
语法转换成JavaScript
语法注意:三者引用顺序必须是
react
、react-dom
、brower
yeoman
前端脚手架工具
cnpm i -g yeoman
https://github.com/react-webpack-generators/generator-react-webpack#readme
# Make sure both is installed globally
npm install -g yo
npm install -g generator-react-webpack
# Create a new directory, and `cd` into it:
mkdir my-new-project && cd my-new-project
# Run the generator
yo react-webpack
# Start for development
npm start # or
npm run serve
# Start the dev-server with the dist version
npm run serve:dist
# Just build the dist version and copy static files
npm run dist
# Run unit tests
npm test
# Auto-run unit tests on file changes
npm run test:watch
# Lint all files in src (also automatically done AFTER tests are run)
npm run lint
# Clean up the dist directory
npm run clean
# Just copy the static assets
npm run copy
npm i create-react-app
create-react-app your-app-name && cd your-app-name
npm install
npm start