export default {
name: 'App',
metaInfo: {
title: 'Default Title',
titleTemplate: '%s | My Awesome Webapp'
}
}
在Home.vue中：
metaInfo: {
title: ‘首页’
}
vue随笔无谓
[]1.动态设置图片路径
使用DefinePlugin设定环境变量：
new webpack.DefinePlugin({
'process.env': require('../config/dev.env')
})
配置webpack.base.conf.js公共参数alias：
resolve: {
alias: {
'vue$': 'vue/dist/vue.esm.js',
'@': resolve('src'),
'img':resolve('src/assets/images')
}
}
使用：
import A from '@/components/a.vue'
方式一：配置 img 公共路径
<img src="~img/logo.png">
div{
background-image: url('~img/logo.png');
}
方式二：动态路径配置
let png1 = 'logo'
this.imgUrl = require( ` img/${png1}.png ` )
<img :src="imgUrl ">
<div :style="{backgroundImage: 'url(' + imgUrl + ')'}"></div>
[]2.动态设置页面title
方案一：
router.beforeEach((to, from, next) => {
window.document.title = to.meta.name
next()
})
方案二：
引入到main.js中
import Meta from 'vue-meta'
Vue.use(Meta)
改App.vue新增：