技术分享：

最近工作项目推进前后端分离，开始实践vue开发。

今天和大家分享一种思维，如何将传统的开发方式迭代为前后端分离模式。

随着node，vue，react，angular等技术的流行，前后端分离的开发模式逐渐成为开发的主流模式，但是相信很多大型的项目一开始使用的技术是jquery+java或者其他后台语言，由于项目比较庞大，进行代码的重构以及推行前后端分离并不是一件容易的事情，所以实行前后段分离成为flag，一直说做，一直做不起来。

这种情况下迭代着实现前后端分离式最好的方式，一方面不耽误旧的功能的使用，另一方面能够在写新的功能时能够采用前后端分离的模式。

有两种方式：

一、CDN方式

即官方提供的在页面中引入vue或者react等框架的js文件，可以部分使用这些框架的功能，很方便但是这种做法并不彻底

二、完全分离

即用vue框架实现完全的分离，使用过前后端分离的同学都知道，前端项目完成后要发布即将打包后的文件扔到服务器即可或者使用ngnix代理指向index文件，在这里也一样，将打包后的html以及静态文件放到项目中，然后在后台接口的url中指向该页面即可

下面举例在django框架开发的web应用中的使用（前端项目使用的是vue-cli）

首先为了避免打包后static文件名与django的默认static冲突打包配置做以下处理

build: {

index: path.resolve(__dirname, '../dist/index.html'),

assetsRoot: path.resolve(__dirname, '../dist'),

assetsSubDirectory: 'resourceStatic',

assetsPublicPath: '/static/',

其中resourceStatic可以根据自己喜好定义

打包后的目录如下