vue.js+webpack build出的dist怎么放到thinkphp的后台文件目录中运行

单独用vue-cli的脚手架开发好后build除了一个dist目录,里面的index.html也不能直接打开浏览器运行,由于前后端不分离,想把dist里的放到后台目录中,该怎么办

阅读 9.3k
3 个回答

详细看这篇https://segmentfault.com/q/10...我之前提问过,看里边我采纳的那个评论。
如果你是使用官方提供的脚手架打包的文件,需要做的事:
1.修改webpack.base.conf.js的output.publicPath,比如

 output: {
    path: config.build.assetsRoot,
//  path:'../dist',
//  publicPath: process.env.NODE_ENV === 'production' ? config.build.assetsPublicPath : config.dev.assetsPublicPath,
    publicPath:'./',
    filename: '[name].js'
  }

2.配置你的路由选项,vue1.0主要是root,vue2.0有base具体的你自己简单查下文档,我这里使用的是1.0版本:

//创建一个路由器实例
const router = new VueRouter({
    hashbang:false,//去除#!开头
    transitionOnload:false,//初次加载的时候是否对<router-view>处理场景切换效果
    history:true,//是否开启html5模式,去掉锚点
    saveScrollPosition:false //记住页面的滚动位置 html5模式适用
    ,root:'/dist'//路由生效的基础路径
});

按照楼主的第一点修改后,打包好的dist里面的文件可以直接打开正常运行。但是再运行npm run dev 就出错了,显示Cannot GET /。是因为第二点没有设置的原因吗?

后来,打包好后,我又把webpack设置改回来,就正常了。

嗯?前后端不分离你做成SPA真的大丈夫么?不用多页的形式做成PHP页面模板么?

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏