为VUE 脚手架中自定义title标签页小图标

效果如图所示:

一、 在项目index.html同级目录下添加favicon.ico文件

二、 在项目index.html中引入
<link rel=”shortcut icon” type=”image/x-icon” href=”./favicon.ico” />
三、 配置webpack配置文件(build文件夹下面)
在下面两个配置文件中加入:
favicon: path.resolve(‘./favicon.ico’)
具体位置:
1.webpack.prod.conf.js

new HtmlWebpackPlugin({
filename: config.build.index,
template: ‘index.html’,
favicon: path.resolve(‘./favicon.ico’),
inject: true,
}),

2. webpack.prod.dev.js

new HtmlWebpackPlugin({
filename: process.env.NODE_ENV === ‘testing’
? ‘index.html’
: config.build.index,
template: ‘index.html’,
favicon: path.resolve(‘./favicon.ico’),
inject: true,
minify: {
removeComments: true,
collapseWhitespace: true,
removeAttributeQuotes: true
// more options:
// https://github.com/kangax/html-minifier#options-quick-reference
}

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理