如何使用 Budo 开发服务器定义 coffeeify 的扩展？

Question

我正在尝试将 coffeeify 与 budo 一起使用，因此我不必将扩展添加到我的 require 语句中。我尝试通过 budo 的 browserify 选项传递这些命令

budo src/app.coffee --live --serve bundle.js -- -t coffeeify --extension=".coffee"

budo src/app.coffee --live --serve bundle.js -- -t [coffeeify --extension=".coffee"]

我还尝试将 browserify 转换插入我的 package.json

"browserify: { "transform": ["coffeeify", {"extension": ".coffee"}] }

Answer 1

这是对我有用的东西（我花了很长时间才弄明白，最困难的部分是让 watchify 与 coffeescript 一起工作）。一切都在package.yaml。从您的顶级文件夹调用 npm start，它就可以解决问题。 npm 将所有本地安装的节点二进制文件放入您的 PATH 中（它们通常位于 node_modules/.bin 下）。

{
  "name": "my-package",
  "version": "1.0.0",
  "private": true,
  "scripts": {
    "start": "(cd src; budo app.coffee:bundle.js --dir . --live --verbose -- --extension=.coffee | garnish)"
  },
  "browserify": {
    "extension": [ ".coffee" ],
    "transform": [ ["coffeeify"], ["brfs"] ]
  },
  "devDependencies": {
    "brfs": "1.4.1",
    "browserify": "11.1.0",
    "budo": "^5.1.5",
    "coffee-script": "latest",
    "coffeeify": "^1.1.0",
    "garnish": "^3.2.1",
    "watchify": "3.4.0"
  }
}

我的源代码位于 src 文件夹下，还有一个名为 app.coffee 的文件，其中包含（或 node.js 术语中的 require）我的整个应用程序。我的 src 文件夹中有一个 index.html，它通过 html script 标签引用 bundle.js。

启动武道的命令在我的package.json里面。它首先进入我的 src 文件夹。
诀窍是在 browserify 块中指定一些配置：扩展名 .coffee 需要存在，以及转换列表。我尝试在命令行上设置所有内容，但从未成功
调用 npm start 后，因为我将 --live 参数传递给 budo，所以一切都像魔术一样工作，edit/saves 我的文档确实会触发浏览器 reload/refresh.

要部署或发布，您可能需要另一个目标以使用 uglify.js 缩小。我仍然有一个分两步手动完成的脚本，第一步调用 browserify，第二步明确调用 uglify.js。

顺便说一下，我听说最新版本的 budo 会为您装饰管道。另一个技巧是查看 React 人员正在做什么来转换他们的 .jsx 文件，因为它在理论上非常接近 coffeescript 人员需要做的事情。 React 似乎有着巨大的发展势头，所以希望 React 的人会首先解决这些构建问题。

如何使用 Budo 开发服务器定义 coffeeify 的扩展？

How do I define an extension for coffeeify with Budo dev server?

coffeescript

browserify