2

我正在使用以下 npm 构建工具的组合开发浏览器应用程序

  • 浏览器化
  • 咖啡化
  • 关注

我的 package.json 文件的脚本部分是：

  "scripts": {
    "build": "browserify -t coffeeify init.coffee -o ../www/bundle.js",
    "watch": "watchify -t coffeeify init.coffee -o ../www/bundle.js"
  }

到目前为止，我已经配置了我的项目，以便在开始工作之前，我输入“npm run watch”命令，并且每当我更新一个时，所有 CoffeeScript 文件都会自动捆绑到 bundle.js 文件中。现在，我还想要几个 .SCSS 文件，这些文件会自动编译成 .CSS 文件，然后全部打包并压缩成一个 min.css 文件。而且，理想情况下，我希望无需输入除我已经为我的 CS 文件输入的命令（“npm run watch”）之外的命令来完成此操作。

这是我的 package.json devDependencies：

  "devDependencies": {
    "coffee-script": "^1.10.0",
    "coffeeify": "^2.0.1",
    "browserify": "^12.0.1",
    "watchify": "^3.6.0",
    "node-sass": "^3.4.2",
    "yuicompressor": "^2.4.8"
  }

到目前为止，我已经使用 PhpStorm 的文件观察器和 node-sass npm 模块成功地将我的 .SCSS 文件编译为 .CSS 文件。经过一番阅读，我决定使用 yui 压缩器（它也作为 Node 模块安装，如上所示）。但是，经过大量搜索，我找不到有关如何执行此操作的良好描述。

我应该更新：

"watch": "watchify -t coffeeify init.coffee -o ../www/bundle.js"

我的 package.json 文件中的行？如果是这样，怎么做？

我希望最终结果是，只要 SCSS 文件夹中的文件发生更改，其他文件夹中的 min.css 文件就会自动重新编译。

（如果我的目的有更好的选择，我不一定坚持使用 yui 压缩器。）

4

0 回答 0