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. 【JAVA基础】一:聊聊笔试常见到的 “==、equal” 比较是否相等的内在差别

    开始本文之前,先让我们记住一个口诀(这个口诀只针对基础的类比如String.Integer等,如果是自定义的类,需要看equal的具体实现): equal比较其值,== 比较地址 这两天在走查代码的时 ...

  2. python ironicclient源码分析

    ironicclient是一个cli工具,用来和用户交互的. 首先写一个简单的例子,获取ironic所有的node节点: from ironicclient import client if __na ...

  3. 爬虫——scrapy入门

    scrapy 安装scrapy pip install scrapy windows可能安装失败,需要先安装c++库或twisted,pip install twisted 创建项目 scrapy s ...

  4. 20189210牟健 《Linux内核原理与分析》第二周作业

    本周学习了汇编指令以及通过反汇编一个小程序来了解栈的变化 写了一个简单的C程序,如图所示: 通过gcc -s -o main.s main.c -m32指令将其编译成汇编程序 打开该汇编文件并删除不重 ...

  5. thinkphp框架,数据动态缓存后,或数据已读取出来,想分页怎么办

    //读取缓存后赋值到数组,通过array_slice函数处理,如: $blog = S('blogname'); //赋值 $count = count($blog); //条数统计 $page = ...

  6. Web Service学习(一)

    1.WebMethod特性包含哪些属性,都有什么用? 1.BufferResponse属性 该属性表明是否启用对Web Service方法响应的缓冲.当设置为true时,Web Service方法将响 ...

  7. 将整数m的各位数字保存到数组A中

    import java.util.Scanner; /** * @author:(LiberHome) * @date:Created in 2019/3/4 20:10 * @description ...

  8. python语法_嵌套

    列表里面每个元素可以是不同的数据类型,每一个元素也可以是一个列表或者元组等, a = [[1,2,3],"a",13,(5,7,9,"dasd")] b = a ...

  9. Windows下搭建kafka运行环境

    完整解决方案请参考: Setting Up and Running Apache Kafka on Windows OS   在环境搭建过程中遇到两个问题,在这里先列出来,以方便查询: 1. \Jav ...

  10. linux 编译静态库及动态库例子--from周立功文档

    /* hello1.c */#include <stdio.h>int hello1 (void){printf("hello 1!\n");return 0;}/* ...