React脚手架下入口文件index.html的解释说明

时间：2023-02-11 14:36:28 类型：React
字号： 小  中  大

React脚手架下入口文件index.html的解释说明

<head>
    <meta charset="utf-8" />
    <!--%PUBLIC_URL% 代表 public的路径  react中的一个关键词  -->
    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
    <!-- 开启理想视口， 用于做移动端网页的适配 即视口与设备物理像素一致 -->
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <!-- 用于配置浏览器页签 + 地址栏的颜色(仅支持安卓手机浏览器, 开发时很少用，因为兼容性差) -->
    <meta name="theme-color" content="#000000" />
    <meta
      name="description"
      content="Web site created using create-react-app"
    />
    <!-- 用于指定网页添加到手机主屏幕后的图标(页面的快捷链接) 仅支持苹果 -->
    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
    <!-- 应用加壳时的配置文件  html + 加壳 == 生成一个 安装或IOS的app应用 -->
    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
   
    <title>React App</title>
  </head>
  <body>
    <!-- 如果 浏览器不支持JS，则显示标签中的内容，当然，现在的浏览器都支持, 所以这段代码其实不写也没关系，只是React老虎的更加全面了, 照顾了老掉牙 -->
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>
    <!-- react 容器 -->
    <!--  后续的App.js组件会放到id = root 的容器中， 且我们自己定义的组件放到App容器中-->
  </body>

App.png

<