vue+webpack写完页面如何打包与后台对接

Question

1.我用Vue+webpack写完前端页面，但是我们前后端没有完全分离，要如何打包跟后台对接，然后将index.html转化为jsp文件以供后台使用。
2.打包之后会生成build文件夹，是要将build文件夹的文件提交给后台还是怎样嘛？求大神指导。

Answer 1

不知道你说的 前后端没有完全分离 指的是哪部分，如果模版数据耦合就麻烦了，仅仅是页面耦合比较好办。

如果用的是尤雨溪大大默认的 webpack 配置，build 下应该会生成 js 等文件，以及 index.html。我的建议是，index.html 交后端，其他文件由你单独发布，比如到一个 CDN，这样你们与后端的工作并行，以后开发起来也会灵活一点。

对你们的业务不了解，只是猜想哈，如果有问题再交流。

初学 Vue， 建议使用 YYX 大大的 vue-cli 生成一个项目模板，然后基于这个模板开发可以避免许多困惑（包括打包之类的）。

Answer 2

jsp是比较偏html的，不怎么关心你的js文件。

而vue+webpack的组合，出来之后html会很小，里面基本上只是共有css/js和div挂载点。关键在于js文件。

所以其实两者的配合是可以比较解耦的。

简单说，前端做出来的页面，html只放外部引用和挂载点，要求后端开发提供同样的环境就是了。
所以你只用传一个js文件过去，给一个html文件当做参考模块（或者接口）。

------我没做过jsp，就是大概知道一下。但是jsp让后端去写就好，你只管那个js文件。

Answer 3

看你的描述，你应该需要这个https://github.com/laoxubuer/...

Answer 4

对于单页面应用，build之后，在build文件夹中有三个文件，一个css,两个js,将这三个文件放到cdn上面，每次修改完后，build一下，将build文件夹中的文件上传至cdn,同时告知后台一下，但是后台那边的index.html是不需要做变化的。

Answer 5

VUE2.0，使用webpack build或npm run build命令打包，会生成一个dist文件夹，文件里就是打包后的资源。我也是参考这个的 https://github.com/laoxubuer/...

Answer 6

楼主，webpack打包过后 build文件中只有js。你说把build给后端程序员，不清楚你的目录接口是怎样的，能够将讲一下吗？

Answer 7

前后端没有完全分离？你是如果做到的？？？你不使用脚手架，，只是引入vueJs包文件吗？请指教~

Answer 8

楼主，不知道你的问题解决了没有，也不知道怎么解决的，我有类似的问题，现在想把那些自己写的Vue组件打包成js文件，但是每个简单的组件打包出来都有200+K，这样太大了。。。我使用的是官方vue-cli那个配置的环境，在上面的基础上修改，JS文件太大了该怎么办呀，不知道您是否有什么好的建议或者解决办法吗，跪求

Answer 9

请问楼主有解决么？ 我现在遇到同样的问题。 build 出来的文件直接交给后台就好了么？