react项目安装及运行
博客地址 :https://www.cnblogs.com/sandraryan/
安装node ,有就跳过。
node.js官网:https://nodejs.org/en/
终端用node -v 和 npm -v 来查看版本号。
用npm 安装 create-react-app工具,自动地在本地目录中创建react项目。
npm install -g create-react-app
全局安装create-react-app脚手架工具,使用命令创建新的react项目。
create-react-app 文件夹名
在文件夹中部署npm,导入react-dom依赖包.
cd 文件夹:
npm init (然后一路回车)初始化 package.json
,它是 NodeJS 约定的用来存放项目的信息和配置等信息的文件。
npm install --save react react-dom ( 在该目录下导入react和react-dom)
npm install --save react-router-dom (react路由,以后会用到)
打开 npm start 成功√
CSS in js 可以将css写在js中react安装styled-copmonents 工具包,对js中css代码进行解析,转码生效(组件化样式)
npm i styled-components --save
安装react 数据监测组件
npm i prop-types --save
react项目安装及运行的更多相关文章
- React Native 安装
第一 :在天朝如果你可以违规上网的话便可以按 react native 中文网的文档进行安装与调试.地址为:https://reactnative.cn/docs/getting-started.ht ...
- 解决react项目中跨域和axios封装使用
最新几天学了一下react,发现了几个问题,估计新入坑的同学们也会遇到,下面我先列出来几点 1.请求跨域问题 2.如何发起请求 3.axios的简单封装 全局安装create-react-app脚手架 ...
- react项目搭建及webpack配置
1,配置webpack npm install -g webpack webpack的cli环境 npm install -g webpack-dev-se ...
- 前端新手如何安装webstorm ,初步搭建react项目
下载安装webstorm:配置成功: 配置成功后就可以开启webstorm项目了.(存微信收藏..) 1:在webstorm下配置node环境: 2:完成之后: React官方脚手架地址: https ...
- react项目如何运行
react项目如何运行 一.总结 一句话总结: npm i 安装好package.json的 指定插件后,npm start 启动项目 二.react项目的安装与运行 转自或参考:react项目的安装 ...
- react 工程起步 安装chrome 开发调试工具 react developer tools 及初建一个react 项目...
1.安装react 开发工具 1.下载 chrome react developer tools 下载地址:https://pan.baidu.com/s/1eSZsXDC 下载好是 ...
- 基于Abp React前端的项目建立与运行——React框架分析
基于Abp React前端的项目建立与运行 目录 基于Abp React前端的项目建立与运行 1 Abp项目配置 2 运行WebApi后端项目 2.1 创建C3D数据库,并且将数据库对应链接字符串替换 ...
- JavaWeb学习之tomcat安装与运行、tomcat的目录结构、配置tomcat的管理用户、web项目目录、虚拟目录、虚拟主机(1)
1.tomcat安装与运行双击tomcat目录下的bin/startup.bat,启动之后,输入http://localhost:8080,出现安装成功的提示,表示安装tomcat成功 2.tomca ...
- React项目搭建及依赖安装
一.前提 首先保证node.js已安装完成... 安装完成后,打开cmd命令行,输入 node -v 和 npm -v 来查看版本号,如果显示则安装完成. 二.安装react脚手架 在cmd命令行中输 ...
随机推荐
- 2018-8-10-win10-uwp-禁止编译器优化代码
title author date CreateTime categories win10 uwp 禁止编译器优化代码 lindexi 2018-08-10 19:16:50 +0800 2018-2 ...
- js中的深拷贝和浅拷贝2
所谓 深浅拷贝: 对于仅仅是复制了引用(地址),换句话说,复制了之后,原来的变量和新的变量指向同一个东西,彼此之间的操作会互相影响,为 浅拷贝. 而如果是在堆中重新分配内存,拥有不同的地址,但是值是一 ...
- jQuery的deferred对象使用详解【转载】
一.什么是deferred对象? 开发网站的过程中,我们经常遇到某些耗时很长的javascript操作.其中,既有异步的操作(比如ajax读取服务器数据),也有同步的操作(比如遍历一个大型数组),它们 ...
- OpenLayers使用弹出窗口
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head ...
- css清除浮动各方法与原理
说到清除浮动的方法,我想网络上应该有不下7,8的方法,介绍这些方法之前,想下为什么清除浮动? 再次回到float这个属性,浮动元素(floats)会被移出文档流,不会影响到块状盒子的布局而只会影响内联 ...
- Python的bisect模块
Python的列表(list)类型内部是一个线性表,在线性表中查找元素复杂度为O(N),即调用list.index()的复杂的是O(N).当数据量较大时,应该使用二分查找优化,二分查找范围每次缩小一般 ...
- 【JZOJ4770】【NOIP2016提高A组模拟9.9】闭门造车
题目描述 自从htn体验了一把飙车的快感,他就下定决心要闭门造车!但是他两手空空怎么造得出车来呢?无奈的他只好来到了汽车零部件商店. 一走进商店,玲琅满目的各式零件看得htn眼花缭乱.但是他很快便反应 ...
- Resource Management in View Controllers
UIViewController生命周期 UIViewControl是IOS程序中的一个重要组成部分,扮演者一个大管家的身份,管理着程序中的众多视图,今天看看了官方文档并做了如下一些简单的记录: 何时 ...
- 2019-5-25-win10-uwp-win2d-入门-看这一篇就够了
title author date CreateTime categories win10 uwp win2d 入门 看这一篇就够了 lindexi 2019-5-25 20:0:52 +0800 2 ...
- Java练习 SDUT-2053_整理音乐
整理音乐 Time Limit: 1000 ms Memory Limit: 65536 KiB Problem Description 请用链表完成下面题目要求. xiaobai 很喜欢音乐,几年来 ...