vue-cli之項目更改標題,keywords


有的時候我們開發完一個vue-cli項目了,想要修改網站的title,keywordsdescription這幾個值怎么修改呢,下面就來介紹一下怎么修改的。

一. 修改vue.config.js

module.exports = {
  chainWebpack: config =>{
      config.plugin('html')
        .tap(args => {
          args[0].title = "title標題";
          args[0].keywords = "keywords內容";
          args[0].description = "description內容";
          return args;
        })
    },
};

二. 更改public/index.html

<!DOCTYPE html>
<html lang="">
  <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">
    <meta name="keywords" content="<%= htmlWebpackPlugin.options.keywords %>">
    <meta name="description" content="<%= htmlWebpackPlugin.options.description %>">
    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
    <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="app"></div>
    <!-- built files will be auto injected -->
  </body>
</html>

按照上面的操作即可實現。一切皆往事在此祝福您生活愉快。如果本文解決了您的問題,麻煩點一下贊。好讓往事知道此文有用。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM