https://new.halfrost.com/zh/tags/vue.js/Recent content in Vue.js on prometheusHugo -- gohugo.iozh-CNhalfrostSat, 08 Jul 2017 09:51:00 +0000https://new.halfrost.com/zh/vue_ios_modularization/Sat, 08 Jul 2017 09:51:00 +0000https://new.halfrost.com/zh/vue_ios_modularization/序 今年大前端的概念一而再再而三的被提及，那么大前端时代究竟是什么呢？大前端这个词最早是因为在阿里内部有很多前端开发人员既写前端又写 Java 的 Velocity 模板而得来，不过现在大前端的范围已经越来越大了，包含前端 + 移动端，前端、CDN、Nginx、Node、Hybrid、Weex、React Native、Native App。笔者是一名普通的全职 iOS 开发者，在接触到了前端开发以后，发现了前端有些值得移动端学习的地方，于是便有了这个大前端时代系列的文章，希望两者能相互借鉴优秀的思想。谈及到大前端，常常被提及的话题有：组件化，路由与解耦，工程化（打包工具，脚手架，包管理工具），MVC 和 MVVM 架构，埋点和性能监控。笔者就先从组件化方面谈起。网上关于前端框架对比的文章也非常多（对比 React，Vue，Angular），不过跨端对比的文章好像不多？笔者就打算以前端和移动端（以 iOS 平台为主）对比为主，看看这两端的不同做法，并讨论讨论有无相互借鉴学习的地方。 本文前端的部分也许前端大神看了会觉得比较基础，如有错误还请各位大神不吝赐教。 Vue 篇 一. 组件化的需求 为了提高代码复用性，减少重复性的开发，我们就把相关的代码按照 template、style、script 拆分，封装成一个个的组件。组件可以扩展 HTML 元素，封装可重用的 HTML 代码，我们可以将组件看作自定义的 HTML 元素。在 Vue 里面，每个封装好的组件可以看成一个个的 ViewModel。 二. 如何封装组件 谈到如何封装的问题，就要先说说怎么去组织组件的问题。 如果在简单的 SPA 项目中，可以直接用 Vue.component 去定义一个全局组件，项目一旦复杂以后，就会出现弊端了： 全局定义(Global definitions) 强制要求每个 component 中的命名不得重复 字符串模板(String templates) 缺乏语法高亮，在 HTML 有多行的时候，需要用到丑陋的 \ 不支持 CSS(No CSS support) 意味着当 HTML 和 JavaScript 组件化时，CSS 明显被遗漏 没有构建步骤(No build step) 限制只能使用 HTML 和 ES5 JavaScript, 而不能使用预处理器，如 Pug (formerly Jade) 和 Babel 而且现在公司级的项目，大多数都会引入工程化的管理，用包管理工具去管理，npm 或者 yarn。所以 Vue 在复杂的项目中用 Vue.https://new.halfrost.com/zh/vue_electron/Sat, 17 Jun 2017 09:50:00 +0000https://new.halfrost.com/zh/vue_electron/利用 Vue.js 实现 objc中国 的跨平台全栈应用 ✅ 桌面应用，支持 Mac、Linux、Windows 三个平台 ✅ Web 应用，支持 桌面浏览器 和 手机浏览器 ✅ 手机 App，目前只支持了 Cordova 框架，支持 iOS、Android、Windows Phone、BlackBerry 四个平台 ❌ 手机原生 App，打算用 Weex 框架，同样一起支持 iOS 和 Android 两个平台 注：此项目纯属个人瞎搞，请大家支持 喵神(@onevcat)，支持 Objc中国。 前言 一.关于我 我是一名全职的 iOS 开发者，非前端开发者。由于接触了 Weex 开发，从而接触到了 Vue.js。 二.为什么会写这个项目？ 最开始有这个想法的时候是来自一个网友，他在我的博客上问我，网上有没有写的比较好的 Weex demo ？我说尤大写的那个 Hacker News 是最好的。后来网友就说，楼主能写一个么？我当时回答暂时不行。其实这事我一直记在心里。 今年5月19号，GitHub 使用 Electron 重写了 macOS 和 Windows 的客户端，加上近些年跨端开发越来越火，对于一些公司来说，Web 和 app 应该都是需要的，app 还需要 iOS 和 Android 两个平台，再有甚者还要开发小程序，桌面级的应用虽然少，但是用 Electron 一样可以一起开发了。自己也萌生了想要跃跃欲试的念头。