刚开始的代码是这样的，使用react router4.x写的demo路由跳转后，页面的没有渲染，是因为没有引入外部css文件（或者说引入外部文件路径错误）

<!DOCTYPE html>

<html lang="en">

  <head>

    <meta charset="utf-8">

    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">

    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <meta name="theme-color" content="#000000">

    <link rel="manifest" href="%PUBLIC_URL%/manifest.json">

    <title>React App</title>

    <link rel="stylesheet" href="./css/bootstrap.css">

  </head>

  <body>

    <noscript>

      You need to enable JavaScript to run this app.

    </noscript>

    <div id="root"></div>

  </body>

</html>

将上面代码（红色部分）的点去掉就可以了，如下所示

<!DOCTYPE html>

<html lang="en">

  <head>

    <meta charset="utf-8">

    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">

    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <meta name="theme-color" content="#000000">

    <link rel="manifest" href="%PUBLIC_URL%/manifest.json">

    <title>React App</title>

    <link rel="stylesheet" href="/css/bootstrap.css">

  </head>

  <body>

    <noscript>

      You need to enable JavaScript to run this app.

    </noscript>

    <div id="root"></div>

  </body>

</html>

react link引入外部css样式的坑的更多相关文章

  1. 久未更 ~ 五之 —— 引入外部CSS样式表 小节

    > > > > > 久未更 系列一:在html中引入外部css样式表 //引入外部css样式表 //<lilnk>要放在<head>标签的第一行, ...

  2. 引入外部CSS的两种方式及区别

    1.CSS的两种引入方式 通过@import指令引入 @import指令是CSS语言的一部分,使用时把这个指令添加到HTML的一个<style>标签中: 要与外部的CSS文件关联起来,得使 ...

  3. Vue style里面使用@import引入外部css, 作用域是全局的解决方案

    问题描述 使用@import引入外部css,作用域却是全局的 <template> </template> <script> export default { na ...

  4. vue引入外部.css文件，webpack将其与.vue中的样式混合打包了，怎么办？

    我使用vue-cli搭自己的博客,希望引入公共样式: // main.js import './assets/styles/common.css' 我本来是希望webpack打包后,能将这个样式独立打 ...

  5. 网站引入了css样式文件能访问，就是没有效果

    今天后端的同事遇到这么个问题,引入了外部css文件也能访问,就是页面上没有效果. 大概是下面这个样子: css引入如下: 我非常的纳闷,说真的我还没遇到过这种情况,UI是可以运行的,一点事都没有... ...

  6. react如何引入外部文件的整理

    1 引入组件 首先就应该是安装了,安装在环境中后通过 import { Select, Button, Icon, QueueAnim } from 'antd'; 就可以把需要的组件引用进来了~ 2 ...

  7. IOS UIWebView引用外部CSS样式（转载）

    首先,将要引用的CSS样式导入到工程文件,然后我们可以自己拼装一个网页并引用这个样式,具体代码实现如下: -(void)viewDidLoad { [super viewDidLoad]; NSStr ...

  8. wap开发使用jquery mobile之后页面不加载外部css样式文件/js文件

    场景: wap开发,使用jquery mobile之后不会加载外部自定义的css文件了,需要手动刷新才会加载,查看外部自定义的js文件也是一样. 解决办法: 1.在page下面添加css样式,就不要写 ...

  9. 通过node.js读取html页面及其页面中引入的css样式

    Node 是什么? Node 是一个基于Chrome V8 引擎的JavaScript 运行环境. Node 不是一种独立的语言.Node不是 JavaScript 框架, Node是一个除了浏览器之 ...

随机推荐

  1. python调用window dll和linux so例子

    #!/usr/bin/python# -*- coding: UTF-8 -*-#python dll.pyimport win32api# 打开记事本程序,在后台运行,即显示记事本程序的窗口win3 ...

  2. EF通过反射追踪修改记录.适合记录变更系统

    private static void IsUpdate<T>(T old, T current, string id) { Model.PerFileHistory history = ...

  3. UI：sqlite数据库

    使用sqllite的时候一些笔记 数据库(管理类),在工程 general 导入 动态链接库 libsqllite3.0.dylib  在.h文件里引入导入 sqllite3.h 头文件 在.h里面声 ...

  4. 我的JSP中文编码解决方案

    虽然以前就知道编码问题,但是一直没有遇到问题,以前用asp.net和php的时候,感觉很自然地写程序,没怎么特别处理编码问题,这回改用java写,真心被恶心到了. 进行了一番查阅学习后,终于搞明白了一 ...

  5. Swift4 类与继承, 类型转换, 类型判断

    创建: 2018/03/05 完成: 2018/03/07 更新: 2018/03/09 完善标题 [Swift4 类与继承, 类型转换] -> [Swift4 类与继承, 类型转换与判断] 补 ...

  6. POJ2482 Stars in Your Window（扫描线+区间最大+区间更新）

    Fleeting time does not blur my memory of you. Can it really be 4 years since I first saw you? I stil ...

  7. SpringBoot入门-15(springboot配置freemarker使用YML)

    https://blog.csdn.net/fengsi2009/article/details/78879924 application.yml spring: http: encoding: fo ...

  8. hdu 1044 Collect More Jewels

    题意: 一个n*m的迷宫,在t时刻后就会坍塌,问:在逃出来的前提下,能带出来多少价值的宝藏. 其中: ’*‘:代表墙壁: '.':代表道路: '@':代表起始位置: '<':代表出口: 'A'~ ...

  9. Service官方教程(1)Started与Bound的区别、要实现的函数、声明service

    Services 简介和分类 A Service is an application component that can perform long-running operations in the ...

  10. ubuntu14.04 + GTX980ti + cuda 8.0 ---Opencv3.1.0(基础+opecv_contrib)配置

    如果喜欢视频的话:YouTube 上有视频教程 https://www.youtube.com/watch?v=1YIAp3Lh5hI 后来我在mac上安装最新版的OpenCV 找到了一片非常详细的教 ...