路由器给html植入广告,如何让Vue单页面工程打包出一份每个路由都有一个对应的.html文件?...

需求:

vue的单页面工程在打包的时候,除了生成一份单页面工程外,还需要额外生成一份和vue路由对应的多个.html文件,

这批html的代码和pages里面的.vue文件几乎是一致的,单个.html页面可以浏览无报错。

例如:

path为/index的页面,对应的是index.vue,最后打包的时候可以生成一个对应的index.html文件,index.vue代码如下:

{{ msg }}

export default {

data () {

return {

msg: 'Hello world!'

}

}

}

.example {

color: red;

}

生成的index.html里面代码则是:

.example {

color: red;

}

{{ msg }}

new Vue({

el:'#app',

data:{

msg: 'Hello world!'

}

});

当然,这是一个简单的例子,实际的项目中会涉及到第三方库、子组件、css预处理器等问题,请问有大佬遇过类似的需求吗?