说明
最近感觉Vue.js很不错，就抽业余时间写了cnodejs社区的webapp,主要技术栈是Vue.js+webpack. 由于是业余时间写的，很多东西都还在完善之中。 目前由我和@yunkou 在一起维护，也欢迎大家提供宝贵点意见让我不断的优化该产品。
代码已经升级到2.0的语法，欢迎pr。
项目源码和线上地址
源码地址：https://github.com/shinygang/Vue-cnodejs,
线上访问地址：http://shinygang.github.io/cnodevue/.
运行截图：
联系方式
微信: g-ganggege 邮箱: 429517385@qq.com 个人感觉Vue.js还不错，也希望大家推进Vue社区的发展。
@qxl1231 欢迎提bug和改进意见。产品还在不断完善中。<br/><br/><a class=“form” href=“https://github.com/shinygang/Vue-cnodejs”>I‘m webapp-cnodejs-vue</a>
@yaojaa 这是webapp，还没打算打包成安装类型的app呢。<br/><br/><a class=“form” href=“https://github.com/shinygang/Vue-cnodejs”>I‘m webapp-cnodejs-vue</a>
@zh-h 哥们，你怎么操作的？没操作出来你说的返回。<br/><br/><a class=“form” href=“https://github.com/shinygang/Vue-cnodejs”>I‘m webapp-cnodejs-vue</a>
@tallman2014 苹果机子最上面有返回键哇，注销的功能还没上呢。后面完善起。<br/><br/><a class=“form” href=“https://github.com/shinygang/Vue-cnodejs”>I‘m webapp-cnodejs-vue</a>
@tallman2014 苹果机子最上面有返回键哇，注销的功能还没上呢。后面完善起。<br/><br/><a class=“form” href=“https://github.com/shinygang/Vue-cnodejs”>I‘m webapp-cnodejs-vue</a>
下载一份到本地运行的时候node-sass报错，搞定node-sass之后运行node server.js发现
dyld: lazy symbol binding failed: Symbol not found: _libsass_version
Referenced from: /Users/WangMing/Documents/Vue-cnodejs/node_modules/node-sass/vendor/darwin-x64-47/binding.node
Expected in: flat namespace
想问下你的node版本是多少，我用的nvm管理的node版本是最新的5.1.0
@wandergis 我用的node V4.2.1,node-sass不是很好装，你把node_modules删掉重新装下，多等会。<br/><br/><a class=“form” href=“https://github.com/shinygang/Vue-cnodejs”>I‘m webapp-cnodejs-vue</a>
@wandergis 可能没装对，我同事上次装也是第一次装了不行，第二次才可以的，你可以多试一次。<br/><br/><a class=“form” href=“https://github.com/shinygang/Vue-cnodejs”>I‘m webapp-cnodejs-vue</a>
@wandergis 哈哈，客气了哈，我只是刚好遇到过这样的问题，有问题再交流吧。<br/><br/><a class=“form” href=“https://github.com/shinygang/Vue-cnodejs”>I‘m webapp-cnodejs-vue</a>
@huazhenhz Restful是一种前后端交互规范，和angular或者vue关系不大，都可以这样弄。<br/><br/><a class=“form” href=“https://github.com/shinygang/Vue-cnodejs”>I‘m webapp-cnodejs-vue</a>
express或者restify或者moajs都可以非常容易的实现rest
/**
* Auto generate RESTful url routes.
*
* URL routes:
*
* GET /deliveries[/] => delivery.list()
* GET /deliveries/new => delivery.new()
* GET /deliveries/:id => delivery.show()
* GET /deliveries/:id/edit => delivery.edit()
* POST /deliveries[/] => delivery.create()
* PATCH /deliveries/:id => delivery.update()
* DELETE /deliveries/:id => delivery.destroy()
*
*/
router.get('/new', $.new);
router.get('/:id/edit', $.edit);
router.route('/')
.get($.list)
.post($.create);
router.route('/:id')
.patch($.update)
.get($.show)
.delete($.destroy);
@shinygang 记得AngularJS可以实现浏览器地址栏里的Restful模式的Url。 比如，products/computers/dell，不知用Vue能实现这样的效果吗？
@huazhenhz 可以的，vue-router支持这样写的。<br/><br/><a class=“form” href=“https://github.com/shinygang/Vue-cnodejs”>I‘m webapp-cnodejs-vue</a>
@huazhenhz rest需要服务端定义规范，前端按规范请求接口吧。如果服务端那边没这样规范，前端这样操作是徒劳了。<br/><br/><a class=“form” href=“https://github.com/shinygang/Vue-cnodejs”>I‘m webapp-cnodejs-vue</a>
@shinygang 是的，服务器段是需要对应相应的。我想知道像products/computers/dell这样的url如何能指向目标products/computers/computer.html页面。 比如，我在服务器端采用ASP.NET Web API(我不打算用ASP.NET MVC里的VIEW)，浏览器视图采用.html文件，当用户请求products/computers/dell这个地址时，系统实际上会指向products/computers/computer.html?type=dell地址(服务器端采用ASP.NET Web API 响应products/computers/dell请求，并生成JSON返回给products/computers/computer.html)，但用在浏览器的地址栏里看到的仍然是products/computers/dell，我希望能在浏览器端实现这个效果，而不是在服务器端借助url重写或是服务器端的程序来实现。 记得AngularJS是可以实现这样的效果的。
@wandergis 哈哈，没注意呢，可能今天更新代码影响到了，你先输入复制粘贴token登录吧。<br/><br/><a class=“form” href=“https://github.com/shinygang/Vue-cnodejs”>I‘m webapp-cnodejs-vue</a>
@huazhenhz 建议你看些vue-router文档，是支持这样写的。<br/><br/><a class=“form” href=“https://github.com/shinygang/Vue-cnodejs”>I‘m webapp-cnodejs-vue</a>
@myy 哥们，咋个操作的，我用qq浏览器不卡啊。<br/><br/><a class=“form” href=“https://github.com/shinygang/Vue-cnodejs”>I‘m webapp-cnodejs-vue</a>
@kylezhang 明显啊，ng你要全部重新学，一套一套的。react你要重新学一半，它不方便操作dom，绝大多数的jq控件就废了。vue和jq配合很好，至少现在用着没遇到特别麻烦的事情。 自豪地采用 CNodeJS ionic
@shinygang我用ionic搞过一个测试的app,比较吃力，而且不兼容。现在我们公司在研究react native，听说搞原生的也要求他们会。。。 您这个项目列表页没“回到顶部”功能，体验度不好。
请问一个入门的问题，就是如果我是从头开始编写页面， 或者浏览Views/下的vue页面文件，请问，怎样能比较清楚的浏览页面的html元素（查看页面元素和布局位置等），目前代码的部分是比较清楚的一块（javascript部分）。 比较混杂的是 <section id=“page”> <!-- 首页列表 --> <ul class=“posts-list”> <li v-for=“item in topics" v-link=”{name:‘topic’,params:{id:item.id}}"> 这些部分，如果页面元素table, list, li, text等比较多，那想看页面的元素和位置等几乎不太可能了。
当然如果是一个简单的页面，从头写，可以先写好html元素的，静态的，然后再一步步修改为vue动态的组件。。但是复杂的页面，不熟悉的旁人浏览器来就困难了。
请问大家是怎么解决此类问题的？ 多谢！
下拉加载的时候接口调用可以优化的…
你是 page=1 limit=10 page=1 limit=20… 到后面我看了几千条你每次拉数据就拉几千条哇？
不是可以page=1 limit=10 page=2 limit=10的吗
@anjostar 这个我专门这样处理的，而且使用的用户也不回拉到几千条这样子。最开始我是你那种方案，但是这个方案有个bug：用户在某一页停顿的时候，有人评论了其他页面的专题，专业下拉下一页的时候会存在重复数据了。
@Jackalchenxuxu 这个google浏览器调试模式开启的时候可以看你的页面。，至于页面元素就直接在你想看的元素右键有个“审查元素”。
总之，用好google浏览器调试模式，一切皆有可能。
请教楼主，首页和list页面的loading怎么require进去的呢？我看到components里的loading.vue，但是在index页没有看到它被require进去呀
@DoranYun 哥们，页面默认那个loding是加在样式里面的，loading.vue这个loading不是页面的加载loading，是提交数据的时候那个缓冲提示。
@shinygang 谢谢，看到了；
我尝试改写时遇到一个小坑，我在单独的sass文件里用相对路径引入了一张图片，在vue组件中如果在style中使用sass的@import 加入这个sass文件会导致找不到图片报错，在script标签中使用js import就能正常使用。。
@Alex-fun 切换动画后期优化，最近公司的事情忙，就没来得及，之前是直接用webpack压缩的，遇到些问题。赶紧gulp和webpack搭配也不是坏事，各自做各自的强项。
请教下作者用什么IDE开发的。那种IDE最好。 1、vue 后缀在其他IDE，都是纯文本状态，没有智能色彩标注看的很难受。 2、webpack 服务端怎么调试请教， 客户端我可以用Google断点， server.js 怎么调试, 最原始的console.log 么。
@libinqq 问题1：我用的sublime,有专门的高亮插件，叫:vue-syntax-highlight-master， 问题2：我没太明白你的意思，webpack只是工程构建打包压缩之类用的，你服务器和这个关系不大啊，一般服务端都是健全的log机制来处理吧。
再请教个小白问题。 每个模板页面都有个route data (transition){ 我想问的是，是那里触发的， route 好像是执行的起始点， 我想知道是那里触发了data (transition)， transition 回调对象，对象是什么对象，transition = Object {to: Route, from: Object}， 看起来想路由对象，是vue的插件么。
我知道了，要学习vue-router。 要看这个文档 http://router.vuejs.org/zh-cn/pipeline/hooks.html#transition-object
已star，很好； 怎么登陆？ 本人node 0.12，webstorm 10出现的问题： 怎么minify打包发布完成整个流程？还是打包压缩发布不在项目考虑范围之内，需要自己写？ npm run dist/build只会成为’NODEENV=development/production gulp’然后失败； 能用的只有gulp webpack，而且dist出的内容缺index.html并不能运行，需要补足，而且没有minify； 最新版gulp clean使用arrow function，但运行时并没有babel支持(升级至4.2.4解决）
@w10036w 登录用cnode这边提供的token，node版本是v4.2.1，这个package.json里面已经注明了。工程的打包压缩都在gulp和webpack的时候已经处理。dist目录是生产环境目录，我这边是没有把dist目录放到git里面，你可以复制外面的index.html到对应的文件夹。babel支持是有的，你拉取最新代码和升级你的node版本。上面的一些错和你的node版本有很大的关系。
很好的vue入门 示例源代码，正在学习研究中，很感谢。
在评论回复中发现 @xxx （其对应链接因为href直接渲染，没有v-link 处理）点击后替换了路由<br/><br/><a class=“form” href=“https://github.com/shinygang/Vue-cnodejs”>I‘m webapp-cnodejs-vue</a>
学习了，好强大的样子<br/><br/><a class=“form” href=“https://github.com/shinygang/Vue-cnodejs”>I‘m webapp-cnodejs-vue</a>
最近也在看vue, 从楼主这个项目的源码中学到了很多, 多谢. 另外,下拉加载那个问题太耗流量了, 如果滑动几页, 每次都全部重新加载就好几兆了, 后面会越来越慢. 但如果只更新页数总共才几百K , 然后每次更新的时候做一个重复检查不是更好? 想看最新的回复帖子就让他手动刷新去吧, 哈哈
请问一下，我把工程在本地运行的时候，报了下面的错误
ERROR in The node API for babel has been moved to babel-core. @ multi main webpack: bundle is now VALID.
验证二维码提示跨域啊。提了issue。 我最近也在写vue 的cnode。https://github.com/stop2stare/cnode-vue
来自酷炫的 CNodeMD
@stop2stare 哥们，当时我做的时候采用了两种方案，首先js能识别的二维码直接js端识别，不行就采用的服务端识别二维码，现在服务器到期服务端识别那个挂了，就没维护了，网页搞二维码识别比较麻烦，感觉没多大必要。<br/><br/><a class=“form” href=“https://github.com/shinygang/Vue-cnodejs”>I‘m webapp-cnodejs-vue</a>
@shinygang 大哥，竟然在这里碰到你，十一之前忘了是在哪个博客看到这个项目，由于初学Vue，然后立马clone了一下，看了一下大致的项目结构，然后自己就也搞了一个web端的cnode-vue，人比较笨，花了将近一个月才写完，web端搞完之后还想在搞个移动端的，正在构思中…，再次感谢Vue-cnodejs带给我的启发<br/><br/><a class=“tag” target=“new” href=“https://github.com/BubblyPoker/cnode-vue”>来自 cnode-vue</a>
@shinygang 作者你好，为什么user-info.vue文件里的那段代码
this.$router.push({
name: 'login',
query: {
redirect: encodeURIComponent(this.$route.path)
}
});
不是应该导航到：http://localhost:8020/login?redirect=%2Flist吗？为什么在浏览器中显示的是：http://localhost:8020/login?redirect=%252Flist呢？%25不是代表‘%’号么？我不太理解，能否解释下.
