我想在我的 React 项目中使用 bootstrap 的 cdn。我在哪里以及如何插入 cdn？

Question

我目前正在开发一个 React 单页应用程序，我无法弄清楚在我的项目中将 Bootstrap CDN 放置在何处以及如何让我的 bootstrap 工作。

此外，如果有人可以建议如何为您的项目npm安装bootstrap。

Answer 1

CDN

<HTML>
        <head>
    <!-- YOU CDN -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
        </head>
        <body></body>
        </HTML>

npm

npm install bootstrap@3

require('bootstrap') 会将所有 Bootstrap 的 jQuery 插件加载到 jQuery 对象上。 bootstrap 模块本身不导出任何东西。您可以通过加载包顶层目录下的 /js/*.js 文件来单独加载 Bootstrap 的 jQuery 插件。

Bootstrap 的 package.json 在以下键下包含一些额外的元数据：

less - Bootstrap 的主要 Less 源文件的路径 style - Bootstrap 的非缩小 CSS 的路径已使用默认设置预编译（无自定义）

Answer 2

如果您使用 create-react-app，则在 public/index.html 中有一个文件，或者说在您首先呈现的索引 html 页面中，请在此处使用 cdn 喜欢

<head>
    <meta charset="utf-8">
    <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">
    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css">
    <title>React App</title>
  </head>

Answer 3

npm install --save bootstrap

在此之后将其导入 App.js

import 'bootstrap/dist/css/bootstrap.min.css';

我想在我的 React 项目中使用 bootstrap 的 cdn。我在哪里以及如何插入 cdn？

I want to use bootstrap's cdn in my react project. Where and how do I insert the cdn?

reactjs

twitter-bootstrap-2