Vue sprockets-vue 0.1 发布,已经有 49 个 star ❤️

kikyous · 发布于 2017年02月09日 · 最后由 BoleLee 回复于 2017年04月11日 · 942 次阅读
2564

https://github.com/kikyous/sprockets-vue

简单的来说这个 gem 就是把.vue文件转换成 js 对象(不需要 vueloader,webpack 等),让你享受.vue单文件组件的同时使用 rails原生一套东西,并保持现有的部署方法

举个栗子

#app.vue

<script lang="coffee">
module.exports = {
  data: ->
    users: []
  methods:
    clear: ->
      this.users = []
}
</script>

<template>
  <ul>
    <li v-for="m in users" :m='m'></li>
  </ul>
</template>

<style lang="scss">
</style>

现在你可以在 js 或者 coffee中直接引入这个组件:

#application.coffee

#= require app

现在你就可以通过全局变量VComponents来访问 app 了

#= require app
new Vue(
  el: '#main',
  components: {
    'app': VComponents.app
  }
)

更新内容

0.1是比较大的更新:

  • script中使用module.exports={}而不是vm={},尽量和 vueloader 保持一直
  • 使用VComponents而不是VCompents
  • script 支持原生 js

感谢 https://github.com/dts 的贡献

共收到 11 条回复
5575

支持一下👏

9401

支持原生js了? 那就是可以使用es6的所有新增功能了吗?

2564

#3楼 @kai209209 es6还不支持

2564

#5楼 @kai209209 coffee 挺好的😁

9401

#6楼 @kikyous ES6里有些很好的功能,没法转成coffee啊,就像import和export,我就不知道怎么用coffee实现

2564

#7楼 @kai209209 要用import和export还是用 webpack 那一套吧😁

1

#7楼 @kai209209 coffee 支持 import export,但是不解析模块,需要再加一个 babel 之类的编译器。

ES6 在浏览器环境算不上原生。

2099

目前我是参考了 react_on_rails 的模式,用 webpack 来做构建,然后 build 出来的文件放到 app/assets/javascripts 下面,然后 rails 再去引用

这样既不会影响 assets pipeliine,又能够享受基于 nodejs 所有的构建工具所带来的好处。

29323
2099hz_qiuyuanxin 回复

可以分享下你的方法吗,发一个项目例子,感激!

需要 登录 后方可回复, 如果你还没有账号请点击这里 注册