1、 开发环境
编辑器：sublime text3
语言：vue
2、 代码格式化：
借助sublime编辑器，安装HTML-CSS-JS Prettify插件：
a)在Sublime Text 3中，按下Ctrl+Shift+P调出命令面板;
b)输入install 调出 Install Package 选项并回车;
c)输入pretty，并在列表中选择HTML-CSS-JS Prettify后回车即可安装。
d)查看本地安装的NodeJS配置环境路径（在dos命令下，输入where node并回车）。
e) 菜单 -> Preferences -> Packpage Settings -> HTML/CSS/JS Prettify - Set `node` Path，设置一下nodejs路径：
默认对vue不支持,在"allowed_file_extensions": ["htm", "html", "xhtml", "shtml", "xml", "svg", "vue"]加上vue就好了
f）菜单-> Preferences -> Packpage Settings -> HTML/CSS/JS Prettify – Plugin Options -Default，最后"use_editor_indentation": true
g)设置sublime tab size = 4，sublime窗口右下角space/tab size点击，选择tab width=4:
h)安装完成，按快捷键Ctrl + Shift + H即可。
3、 命名规范：
命名需遵从以下原则：
有意义的: 不过于具体，也不过于抽象
简短: 2到3个单词
具有可读性: 以便于沟通交流
a) 小驼峰命名：页面名、页面内变量名、方法名
b) 大驼峰命名：组件文件名、组件名
c) 中划线命名：html模板(css)中的class类名
d) 下划线命名：局部变量
e) 全大写命名：vuex相关事件
4、 vue组件结构化：
按照一定的结构组织，使得组件便于理解。
<template>
<div>
<!-- ... -->
</div>
</template>
<script type="text/javascript">
export default {
// 不要忘记了 name 属性，name名与vue文件名保持一致
name: '',
// 变量
data() {},
// 计算属性
computed: {},
// 组件属性、变量
props: {
bar: {}, // 按字母顺序
foo: {},
fooBar: {},
},
// 使用其它组件
components: {},
// 生命周期（钩子）函数
created() {},
mounted() {},
// 方法
methods: {},
// 监听函数
watch: {},
};
</script>
<style lang=”scss” scoped>
</style>
5、 scss编写：
采用scss编写样式，
a) <style>标签一点要加上scoped属性
b) 使用{}作用域，避免不同文件之间的样式冲突
