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的更多相关文章

  1. react脚手架改造(react/react-router/redux/eslint/karam/immutable/es6/webpack/Redux DevTools)

    公司突然组织需要重新搭建一个基于node的论坛系统,前端采用react,上网找了一些脚手架,或多或少不能满足自己的需求,最终在基于YeoMan的react脚手架generator-react-webp ...

  2. react 脚手架 及路由和 redux

    前提是我们需要下载 nodejs 使用 npm 下载 react 的脚手架,react-router-dom,redux 全局下载 react 的脚手架:npm i create-react-app ...

  3. tap news:week5 0.0 create react app

    参考https://blog.csdn.net/qtfying/article/details/78665664 先创建文件夹 安装create react app 这个脚手架(facebook官方提 ...

  4. Create React App

    Facebook开源了React前端框架(MIT Licence),也同时提供了React脚手架 - create-react-app. create-react-app遵循约定优于配置(Coc)的原 ...

  5. 如何扩展 Create React App 的 Webpack 配置

    如何扩展 Create React App 的 Webpack 配置  原文地址https://zhaozhiming.github.io/blog/2018/01/08/create-react-a ...

  6. 在 .NET Core 5 中集成 Create React app

    翻译自 Camilo Reyes 2021年2月22日的文章 <Integrate Create React app with .NET Core 5> [1] Camilo Reyes ...

  7. 利用 Create React Native App 快速创建 React Native 应用

    本文介绍的 Create-React-Native-App 是非常 Awesome 的工具,而其背后的 Expo 整个平台也让笔者感觉非常的不错.笔者目前公司是采用 APICloud 进行移动应用开发 ...

  8. 使用create react app教程

    This project was bootstrapped with Create React App. Below you will find some information on how to ...

  9. 深入 Create React App 核心概念

    本文差点难产而死.因为总结的过程中,多次怀疑本文是对官方文档的直接翻译和简单诺列:同时官方文档很全面,全范围的介绍无疑加深了写作的心智负担.但在最终的梳理中,发现走出了一条与众不同的路,于是坚持分享出 ...

  10. [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  ...

随机推荐

  1. python学习:修改字符串大小写

    修改字符串大小写 函数:title()字符串首字母大写,upper()字符串全部大写,lower()字符串全部小写. 代码举例: name = "ada lovelace"prin ...

  2. GMA Round 1

    学弟说我好久没更blog了. 因为自己最近其实没干什么. 所以来搬运一下GMA Round 1 的比赛内容吧,blog访问量.网站流量一举两得. 链接:https://enceladus.cf/con ...

  3. 第二天(就业班) html的引入、html常用标签、实体标签、超链接标签、图片标签、表格、框架标签、表单[申明:来源于网络]

    第二天(就业班) html的引入.html常用标签.实体标签.超链接标签.图片标签.表格.框架标签.表单[申明:来源于网络] 第二天(就业班) html的引入.html常用标签.实体标签.超链接标签. ...

  4. dhtmlx Gantt知识点2

    <link rel="stylesheet" href="../../codebase/skins/dhtmlxgantt_skyblue.css?v=5.2.0& ...

  5. PHP算法学习(2) 轮训加权算法

    2019年1月8日16:10:51 svn地址:svn://gitee.com/zxadmin/live_z    代码在code里面 <?php /* * 加权轮训算法 * * * $arr ...

  6. java_爬虫_从腾讯视频播放界面爬取视频真实地址

    由于想在微信公众号里爬一点儿考研的视频 花了差不多一天的时间把这个爬虫做好(其实也不算爬虫吧,就算个能批量处理的地址解析器,半个爬虫) 不多说,进正题 (本文适合有java基础的同学,没基础的用客户端 ...

  7. 【Python基础】lpthw - Exercise 43 基本的面向对象分析和设计

    1. A game from sys import exit from random import randint from textwrap import dedent # 使可以使用三引号型的字符 ...

  8. git分支与主干合并操作

    git分支与主干合并操作1.主干合并分支在主干上合并分支 branch (master)git merge branch --squash 提交合并后的代码 (master)git commit -m ...

  9. Express全系列教程之(六):cookie的使用

    一.关于Cookie 在我们关闭一个登录过的网址并重新打开它后,我们的登录信息依然没有丢失:当我们浏览了商品后历史记录里出现了我们点击过的商品:当我们推回到首页后,推荐商品也为我们选出了相似物品:事实 ...

  10. Sessions Hang on row cache lock

    Sessions Hang on "row cache lock" (dc_objects) While Creating & Dropping a Table Concu ...