vue-element-admin更改网页标题和图标

一、更改网页标题

1、找到permission.js

document.title = getPageTitle(to.meta.title)

这句话就是获取页面标题，

选中 getPageTitle 按F12键转到定义，来到了get-page-title.js

页面中有句const title = defaultSettings.title || 'hello world'

import defaultSettings from '@/settings'

const title = defaultSettings.title || 'hello world'

export default function getPageTitle(pageTitle) {
  if (pageTitle) {
    return `${pageTitle} - ${title}`
  }
  return `${title}`
}

在单引号中更改。

然后可以看到

const title = defaultSettings.title || 'hello world'

这句话中的defaultSettings是从settings文件导入的，然后选中defaultSettings，再按F12键来到settings.js

看到下面的title，更改即可。

module.exports = {

  title: 'hello world',

...

二、更改网页图标

在public文件夹下有 index.html 和 favicon.ico ，所以将 favicon.ico 换成自己需要的即可。

更换时可以 先把原有的favicon.ico图标删除，然后将自己需要的图标也命名为favicon.ico。

可能的问题在于，不是单纯的把某个图像直接改名。如果是png\jpg类型的图片，可以用ico在线转换工具转换一下，此时要把转换出来的所有图片都放到public文件夹下。

然后再重新npm install项目后，再启动项目。