基于 vue + vue-router + vuex + ES6 + less + superagent + flex.css 重写 vue 版 cnode 社区

2016-09-18 10:59:20 +08:00
 1340641314

vue-cnode

基于 vue + vue-router + vuex + ES6 + less + superagent + flex.css 重写 vue 版 cnode 社区

demo

下载

  git clone https://github.com/lzxb/vue-cnode.git
  cd vue-cnode
  npm install (安装依赖模块)
  npm install webpack -g (没有安装 webpack 的需要安装)

运行( nodejs 6.0+)

  npm run dev (开发版本访问: http://localhost:3000/)
  npm run dist (发布生产版本)

功能

  1.登录退出
  2.列表分页,查看帖子
  3.发帖,回复帖子
  4.我的消息
  5.个人中心
  6.查看别人的资料
  7.生成离线缓存清单

感受

由于之前使用 react 写过 react-cnode ,
再使用 vue 写 vue-cnode 时便能够很快入手。
vue 模板的方式对比 react 的 jsx 方式,虽然入手简单,但是图灵表达能力不足,
由于公司很多的后台管理系统之前都是基于 bootstrap + jQuery ,
所以 vue 我更乐意推荐后台使用,直接在页面中引入,无需繁琐的配置,快速上手开发
如果在移动端做一个完整的 webApp ,我比较倾向于使用 react 开发,
因为以后有机会还是可以玩玩 react native

定个小目标

在完成 react-cnode 和 vue-cnode 之后,下一步学习计划是使用 electron + react 再写一个 electron-cnode ,
至于为什么不选择 vue 的原因很简单,因为在写 react-cnode 的时候,对 redux 理解不深,所以想加深对 redux 的理解,
在完成 electron-cnode 之后,如果没有新的技术爆发,估计是使用 react native 再写一个 RN-cnode

题外话

因为我是把 vue-cnode 是放在 git pages 上面,因为觉得访问速度比较慢,便将 vue-cnode 打包成一个离线缓存的 webApp ,
发现了 html-webpack-plugin 并没有将 manifest 的服务器路径设置进去,于是第一次给老外 pull 代码便自然而然的发生了。
如果你的打包生产版本发现 manifest 的文件路径不对,不要惊慌,自己手动修改一下 html-webpack-plugin 的代码即可
附上我 pull 的代码,对着修改即可:
https://github.com/ampedandwired/html-webpack-plugin/pull/434/commits/a7133de5d9ecedf1c2dee337ea391a954dda9ffe
3114 次点击
所在节点    分享创造
6 条回复
gggso
2016-09-18 11:08:43 +08:00
图灵表达能力。。。是啥意思
1340641314
2016-09-18 11:18:57 +08:00
@gggso
可能有误导,引用一下其他文章的说法:
开发者对于用模板还是 JSX 有很多的争执。一方面,模板更接近 HTML - 它能更好地反映你的 app 的语义结构,并且易于思考视觉上的设计、布局和样式。另一方面,模板作为一个 DSL 也有它的局限性 - 相比之下 JSX/hyperscript 的程序本质使得它们具有图灵完备的表达能力。

作为一个兼顾设计和开发的人,我喜欢用模板来写大部分的界面,但在某些情况下我也希望能拥有 JSX/hyperscript 的灵活性。举例来说,当你想在一个组件中程序化的处理其子元素时,基于模板的 slot 机制会显得比较有局限性。

那么,为什么不能同时拥有它们呢?在 Vue 2.0 中,你可以继续使用熟悉的模板语法,但当你觉得受限制的时候,你也可以直接写底层的 virtual-DOM 代码,只需用一个 render 函数替换掉 template 选项。你甚至可以直接在你的模板里使用一个特殊的 <render> 标签来嵌入渲染函数!一个框架,两全其美。
surfire91
2016-09-18 18:32:38 +08:00
看标题名词好多,快要赶超 Java 了 :doge
blanu
2016-09-18 18:45:39 +08:00
thx ,最近在做论坛,非常有帮助。想用 Vue 2.0 写一遍。
1340641314
2016-09-18 21:37:06 +08:00
@surfire91 其实并没有什么卵用
1340641314
2016-09-18 21:37:27 +08:00
@blanu 等 vue2 出正式版了,再继续学习

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/306920

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX