React脚手架create-react-app
1.安装过程
$cnpm install -g -create-react-app
$create-react-app apps
$cd apps/
$npm start
2.图片路径
不能用相对路径<img src="./logo.svg"/>
可以用<img src={require("./logo.svg")}/>
或 import logo from "./logo.svg"
<img src={logo}/>
2.class问题
元素class用className="nav"
3.资源
我们在public中放了一张图片,我们会发现在地址上输
http://localhost:3000/02.jpg 能找到我们指定的图片。说明了react把public当成该项目的web容器。 以后做项目时资源放在public中。
每个组件类中引入图片当使用相对路径的时候,这个图片必须放在src中。
只要使用ajax和钩子 路径就要相对index.html,所以资源需要放在public下,为什么放?
因为public是静态资源。
React脚手架create-react-app的更多相关文章
- react脚手架改造(react/react-router/redux/eslint/karam/immutable/es6/webpack/Redux DevTools)
公司突然组织需要重新搭建一个基于node的论坛系统,前端采用react,上网找了一些脚手架,或多或少不能满足自己的需求,最终在基于YeoMan的react脚手架generator-react-webp ...
- react 脚手架 及路由和 redux
前提是我们需要下载 nodejs 使用 npm 下载 react 的脚手架,react-router-dom,redux 全局下载 react 的脚手架:npm i create-react-app ...
- tap news:week5 0.0 create react app
参考https://blog.csdn.net/qtfying/article/details/78665664 先创建文件夹 安装create react app 这个脚手架(facebook官方提 ...
- Create React App
Facebook开源了React前端框架(MIT Licence),也同时提供了React脚手架 - create-react-app. create-react-app遵循约定优于配置(Coc)的原 ...
- 如何扩展 Create React App 的 Webpack 配置
如何扩展 Create React App 的 Webpack 配置 原文地址https://zhaozhiming.github.io/blog/2018/01/08/create-react-a ...
- 在 .NET Core 5 中集成 Create React app
翻译自 Camilo Reyes 2021年2月22日的文章 <Integrate Create React app with .NET Core 5> [1] Camilo Reyes ...
- 利用 Create React Native App 快速创建 React Native 应用
本文介绍的 Create-React-Native-App 是非常 Awesome 的工具,而其背后的 Expo 整个平台也让笔者感觉非常的不错.笔者目前公司是采用 APICloud 进行移动应用开发 ...
- 使用create react app教程
This project was bootstrapped with Create React App. Below you will find some information on how to ...
- 深入 Create React App 核心概念
本文差点难产而死.因为总结的过程中,多次怀疑本文是对官方文档的直接翻译和简单诺列:同时官方文档很全面,全范围的介绍无疑加深了写作的心智负担.但在最终的梳理中,发现走出了一条与众不同的路,于是坚持分享出 ...
- [React] {svg, css module, sass} support in Create React App 2.0
create-react-app version 2.0 added a lot of new features. One of the new features is added the svgr ...
随机推荐
- Git Sever搭建与相关错误处理
搭建 安装git: sudo apt-get install git 创建一个git用户,用来运行git服务:(用自己的用户也可以,其实) sudo adduser git 创建证书登录: 收集所有需 ...
- 【BZOJ1103】大都市 解题报告
题目传送门 打算5分钟写完题解 题目大意 有一棵n个点的有根树, 初始时每条边均为红色,有两种操作: 把某条边染为蓝色 统计根到某一点路径上的红边数量 思路 用\(a_i\)表示根到点i路径上的红边数 ...
- 红帽 Red Hat Linux相关产品iso镜像下载【百度云】【更新7.2】
RedHat Enterprise Server 6.7 for i386 Boot Disk:rhel-server-6.7-i386-boot.iso SHA-256 Checksum: 798d ...
- iOS 开发中字典和字符串的转换
1.字符串转字典 NSString * jsonString = @""; NSData *jsonData = [jsonString dataUsingEncoding:NSU ...
- JavaScript函数表达式与函数声明
什么是函数? 函数是事件驱动或者被调用时执行的重复代码块. 作用域: 1. 全局作用域 2. 函数作用域(局部作用域) var i = 100; //全局作用域 function fun(){ var ...
- 【洛谷】SAC E#1 Factorial
别人可以眼杀我却研究了一个小时看了题解才懂的数学题 输入: n, k 输出: n!在k进制下后缀0的个数 n,k <= 10^12 将 n! 表示成 x×2y5z 的形式,其中 x mod 2 ...
- [LeetCode] Cheapest Flights Within K Stops K次转机内的最便宜的航班
There are n cities connected by m flights. Each fight starts from city u and arrives at v with a pri ...
- 太原面经分享:如何用js实现返回斐波那契数列的第n个值的函数
面试攒经验,let's go! 值此高考来临之际,闲不住的我又双叒叕出发去面试攒经验了,去了公司交待一番流程后,面试官甩给了我一张A4纸,上面写着一道js算法笔试题(一开始我并不知道这是在考察js算法 ...
- ArcGIS JavaScript开发过程中,底图产生拼接缝问题
ArcGIS JS开发过程中,地图产生了拼接缝 上图调用的是天地图,确认原地图服务是没有这种缝隙的. 其他人电脑上测试,发现没有此问题. 纠结了半天,群里问了大神,大神说是浏览器设置了缩放.... 取 ...
- vue----分级上传
<template> <div class="page"> <div id="filePicker">选择文件</di ...