Vue 开发流程

工作

准备工作

您得确保安装了 gulp；
处于打包需要，您得一款终端软件，推荐Cmder；

环境

终端切换到：cdn/ns/目录下，运行 npm install命令安装插件。
package.json: webpack+gulp 插件配置；
jadeConfig.json: 指定运行项目**&**sftp密码配置；

开发

以Sublime来开发，可安装以下插件为Sublime；当然也可以是别的。
Syntax Highlighting for Sass
vue-syntax-hightlight

以下说法以 majmod 项目来说明：

项目文件夹说明（手累，不写了，参见 web\cdn\ns\majmod_ActTemplateConfig）：
建立新项目：你可以自己按照这个构造进行创建；也可以双击运行 jadeCreateObj.bat，输入你想创建的项目名字即可。

开发项目：

在你创建的项目下运行Cmder（cd 切换到这里），运行webpack -w;开始编写代码；

上传代码到内网，你如果愿意可以使用jeff提供的gulp-sftp;在web/ns/目录下运行gulp即可，记得修改jadeConfig.json里面配置：你懂得。

组件别名引用： 为方便开发，有创建alias.config.js与majmod/actpublic；诸位可自行配置；如此只为方便开发，注意路径；alias.config.js配置示例如下：

module.exports = function() {
return {
ActTools : './../../actpublic/actTools.js',
popupToastComp: './../../../modules/components/widgets/popupToast.vue'
}
}
app.vue中引用示例如下(具体可参见：ns\majmod\majhappykwx)：

import ActTools from "ActTools";
import NormalDlg from './../components/normalDlg.vue';
import popupToast from 'popupToastComp';
运营平台填写活动模板：替换原来的xxx_newtpl 为 xxx_vuetpl。

发布代码发布时，记得运行下webpack -p压缩下代码；否则Vue生成的文件会非常大。

约定

强烈推荐： 写好每一行代码，该留的空白，该有设计模式，都让其有吧；
力荐辅助工具： 力荐使用ES6 + scss + jade进行开发。

因为要过度到组件化了，你写的组件，别人也会用。你写的代码，别人也会去读了。设计的优美与否，经验问题；变量命名问题，坑爹问题。强烈建议，从此起，从局部变量，方法体，文本提示，文件名，组件名，以及CSS类名，统一规范起来。这真是为我们大家开发考虑；况且，命名这里不搞好，引入非自己组件时，很有命名冲突的可能。

温馨提示：

新活动机制（Vue）辅助利用，Vue-loader，File-Loader等插件，以及Webpack，Gulp等打包工具；以及支持使用 jade来书写 html模板；以及可自行使用 Scss，Stylus，Less等 CSS 预处理器框架；同时支持es6等等，在开发效率以及前端规范上，增进不少，具体细节再此不提，有兴趣的可参见Vue活动机制设计（Svn Down下查看即可）。

在此只针对两者性能作出浅析；因对两者学习还需很大程度的深入，难免有所谬误，欢请斧正。

Vue+Webpack+Gulp+jade+Scss活动机制待解决问题：

嗯，Vue开发活动如今方在起步阶段，待解决&完善的地方，还有很多；方才一发性能VS，已多方提及了这套机制的优势，有兴趣的同事一起来继续使其臻于完善。相信我，这是一个很有趣而且大具价值的旅程。在此呢，列出些已知需要完善的点：

全套 Vue 机制打磨+测试+上线，以及修正&全面铺开。
最新 Vue 机制在其他平台对老活动的兼容
现有 Vue 机制对活动换皮的支持
Webpack 打包过程缓慢(开启时巨慢)
组件的丰富以及用法&Demo展示
常用功能插件的提取&重封装
Cdn缓存更新机制(目测Vue不用，待精准验证)
jQuery，Ajax等摒弃和替代方案
以上。

组织欢迎你的加盟。