vue实现多页面应用

近期做的vue项目中,需要新增一个系统帮助页面,并且要在新的窗口中打开,但是vue是单页面应用,所以只能对项目进行改造,变成多页面项目。

第一步:在和index.html页面同级下新增一个helpinfo.html,在src目录下新增一个js目录,新增helpinfo.js以及helpinfo.vue

 vue实现多页面应用vue实现多页面应用

第二步:修改 build下的webpack.base.conf.js文件,新增:helpinfo: ["babel-polyfill", "./src/js/helpinfo.js"]

vue实现多页面应用

第三步: 修改webpack.dev.conf.js文件

vue实现多页面应用

第四步: 修改webpack.prod.conf.js

 vue实现多页面应用

第五步:修改config下的index.js 

vue实现多页面应用


效果图:

vue实现多页面应用

vue实现多页面应用

项目打包之后的效果

vue实现多页面应用