快捷導(dǎo)航

vue項目之index.html如何引入JS文件

更新時間：2022年12月07日 11:46:51 作者：牛先森家的牛奶

這篇文章主要介紹了vue項目之index.html如何引入JS文件問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教

vue index.html引入JS文件

注意路徑的寫法

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="Expires" content="0">
    <meta http-equiv="Pragma" content="no-cache">
    <meta http-equiv="Cache-control" content="no-cache">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <!-- <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> -->
    <link rel="icon" href="<%= BASE_URL %>favicon.ico" rel="external nofollow"  rel="external nofollow" >
    <title><%= webpackConfig.name %></title>
    <!-- 前端監(jiān)控 -->
    <script src="/lib/monitor/web-report-default.min.js"></script>
    <script>
      Performance({
        domain: 'https://frontend-monitor.com/api/v1/report/web',
        add:{
        appId:'<%= htmlWebpackPlugin.options.monitorId %>'   // 生成的其應(yīng)用的appid
        }
      })
    </script>
    <!-- 友盟 -->
    <script type="text/javascript" src="https://s9.#/z_stat.php?id=1279953853&web_id=1279953853"></script>
    <script>
      document.querySelector('a[title]').style.display = 'none'
    </script>
  </head>
  <body>
    <div id="app"></div>
    <!-- built files will be auto injected -->
  </body>
</html>

注意點

<script src="/lib/monitor/web-report-default.min.js"></script>

打包的文件

index.html引入js文件失效的解決

在static文件夾下寫了一個config.js配置文件，但是引入后報錯，提示沒找到該文件

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="icon" href="<%= BASE_URL %>favicon.ico" rel="external nofollow"  rel="external nofollow" >
    <title><%= htmlWebpackPlugin.options.title %></title>
  </head>
  <body>
    <noscript>
      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
    </noscript>
    <div id="main"></div>
    <!-- built files will be auto injected -->
    <script type="text/javascript" src="./static/config.js"></script>
    <script type="text/javascript" src="./static/leader-line.min.js"></script>
  </body>
</html>