vue等框架打包的项目一般为SPA应用，而单页面是不利于SEO的，现在的解决方案有两种：
SSR服务器渲染,如Nuxt.js。
预渲染模式，这比服务端渲染要简单很多，而且可以配合 vue-meta-info 来生成title和meta标签，基本可以满足SEO的需求
注意：
使用预渲染vue-router必须使用history模式
build生成的代码必须放在服务器根目录，否则会报错
可参考官方Vue.js 2.0 + vue-router Prerender SPA示例
安装
cnpm install prerender-spa-plugin --save然后在webpack.prod.conf.js里面添加：
// 头部引入
const PrerenderSPAPlugin = require('prerender-spa-plugin')
const Renderer = PrerenderSPAPlugin.PuppeteerRenderer在webpack.prod.conf.js的plugins里面添加：
// 配置PrerenderSPAPluginnew PrerenderSPAPlugin({// 生成文件的路径，也可以与webpakc打包的一致。staticDir: path.join(__dirname, '../dist'),// 对应自己的路由文件，比如index有参数，就需要写成 /index/param1。routes: ['/', '/product','/about','/contact','/join','/jzjh'],// 这个很重要，如果没有配置这段，也不会进行预编译renderer: new Renderer({inject: {foo: 'bar'},headless: false,// 在 main.js 中 document.dispatchEvent(new Event('render-event'))，两者的事件名称要对应上。renderAfterDocumentEvent: 'render-event'})})最后在main.js里面修改：
new Vue({el: '#app',router,components: { App },template: '<App/>',// 添加mounted，不然不会执行预编译mounted () {document.dispatchEvent(new Event('render-event'))}
})执行 npm run build;将生成的dist中的文件上传到服务器的根目录
如需使用 vue-meta-info 配置title和meta按照以下步骤：
安装：
cnpm install vue-meta-info --save在main.js引入：
import MetaInfo from 'vue-meta-info'
Vue.use(MetaInfo)在vue页面中配置：
<script>
export default {// 配置title和meta数据metaInfo: {title: '我是一个title',meta: [{name: 'keywords',content: '关键字1,关键字2,关键字3'},{name: 'description',content: '这是一段网页的描述'}]},data () {return {}}
}
</script>