零基础学习weex（二）Vue2.0

 本篇内容：
 从Vue1到Vue2
 基础知识
 

1、从Vue1到Vue2

首先，先解决上一章出现的坑。官网是提供解决方案的有效途径，既然不能用前端的开发模式在sublime编辑，那就选择回归weex官方教程的怀抱吧。在上一章已经搭建了weex的环境，直接开始创建weex工程。

初始化 Weex 项目

weex init weexProject

弹出提示输入项目名称，输入weexProject，目录中就创建了一个使用 Weex 和 Vue 的模板项目。先cd到weexProject根目录下，看一下有那些文件生成吧：

weex项目目录.jpg

打开每个文件，看一下里面的内容，猜测作用，这是我学习的过程。有两个重要的文件package.json和webpack.config.js，先介绍下package.json。

packageJson.jpg

• 上面的一部分是项目相关信息
• scripts节点是已经配置好了几个常用的 npm script（npm将在下一章节详细讨论）
• dependencies节点是项目发布的依赖
• devDependencies 节点是项目开发工具

开发

• 通过 npm install 安装项目依赖
• 运行 npm run dev 和 npm run serve 开启watch 模式和静态服务器
• 打开浏览器，进入 http://localhost:8080/index.html 即可看到 weex h5 页面。
• 在第一章已经介绍WeexPlayground，扫描二维码，调试。

至此，从Vue1顺利转移到Vue2。

基础知识

后面的学习，我一边了解基于iOS的WeexSDK，一边熟悉Vue基础，当然这些知识需要自己去充实，了解，在此贴上链接。

• weex教程环境搭建，SDK集成，工具介绍等
• weex手册此部分需要学习weex支持的通用样式、通用事件、flex布局、内建组件、内建模块等；另一方面了解SDK中APIs以及降级方案。这个链接要天天看，时时看，毕竟这是官方文档
• JavaScript当然JavaScript基础也是很重要，如何引入开源库，如何接收数据，如何高效处理CSS，都离不了JavaScript基础
• CSS手册这块只是稍微了解下，毕竟Weex支持的少的可怜，目前开发中就遇到此问题
• CSS手册
• flex布局相当重要，布局核心
• weex社区坑太多，没事多逛逛
• Vue英文
• Vue中文

下一章，开始了解Weex工程、webPack、npm、ESLint、Devtools等。