南部网站建设,网站开发播放大视频卡顿,网站建设与维护王欣,专业的设计网站建设web端三大框架react、vue和angular#xff0c;下面是对react.js的一些总结。 一、环境搭建 1、npm搭建项目 推荐使用npm搭建项目环境#xff0c;如果网速过慢#xff0c;可是使用cnpm进行项目的搭建#xff08;cnpm是淘宝的npm镜像#xff0c;与npm有些差异#xff0c;有…web端三大框架react、vue和angular下面是对react.js的一些总结。 一、环境搭建 1、npm搭建项目 推荐使用npm搭建项目环境如果网速过慢可是使用cnpm进行项目的搭建cnpm是淘宝的npm镜像与npm有些差异有些模块无法下载或无法正常使用。 cnpm install -g create-react-app
create-react-app my-app
cd my-app
npm start 1234打开浏览器输入http://localhost:3000可以看到系统默认生成的页面了。 2、推荐使用的项目结构 https://git.coding.net/yibingCoding/ReactLearn.git 可以通过git clone方式下载项目结构。 二、目录结构与各文件功能 1、目录结构 1、index.html文件为项目的总入口CDN引入的资源可以放在此文件中。 2、package.json文件是模块功能配置使用npm install可生成node_modules文件夹所有模块功能所需要的资源都存储在这个文件夹中。 3、routes.js文件是路由配置文件路由功能是三大前端框架的特色具体用法下面会详细说。 4、Home.js文件是项目结构初始化放上去的界面。 三、react.js的第一个dome 在Home.js中编写代码代码如下 import React,{ Component } from react
import demo1Image from ../../image/demo1Image.jpg; class Home extends Component { render() { return ( div style{{backgroundColor:#0ff,fontSize:20px,color:#00f}} 这是第一个demo img src{demo1Image} style{{width:300px,height:300px}} alt/ /div ) } } export default Home 12345678910111213效果如下 转载于:https://www.cnblogs.com/xukun588/p/9458667.html