README

A PHP 命令行工具，使编译、连接和压缩前端 JavaScript 和 CSS/SCSS 依赖变得简单。

该 minify 和 scssphp 包处理所有繁重工作，此工具将它们结合成一个具有额外功能的单个 CLI 工具。

安装

到包（本地）

composer require-dev itsahappymedium/fec
./vendor/bin/fec help

到系统（全局）

composer global require itsahappymedium/fec
fec help

使用方法

不使用任何参数运行 FEC 将从结构如下所示的 fec.json 文件加载文件

{
  "compile": {
    "css": {
      "build/main.min.css": "scss/main.scss",
      "build/vendor.min.css": [
        "gpm_modules/kazzkiq/balloon.css/src/balloon.scss",
        "scss/vendor/*.scss"
      ]
    },
    "js": {
      "build/main.min.js": "js/*.js",
      "build/vendor.min.js": [
        "gpm_modules/kraaden/autocomplete/autocomplete.js",
        "js/vendor/*.js"
      ]
    }
  }
}

选项

可以将文件路径传递给 FEC 以编译这些特定文件。

• --css--output / -c - 定义将所有 CSS/SCSS 文件连接到一个文件的路径，或定义一个目录的路径以使用 .min.css 扩展名单独处理每个文件。

• --js--output / -j - 定义将所有 JS 文件连接到一个文件的路径，或定义一个目录的路径以使用 .min.js 扩展名单独处理每个文件。

• --no-minify / -n - 不进行任何压缩，仅连接文件。

• --path / -p - 定义一个路径，可以是 JSON 文件或包含 fec.json 文件的目录。

• --remove-important-comments / -r - 删除所有注释，包括标记为重要的注释。此选项还接受文件名或其文件路径的最后部分，仅从该文件中删除重要注释。您还可以在文件名前添加一个 ! 以删除除该文件外的所有文件的重要注释。您可以通过逗号 (,) 分隔多个文件。

• --scss-import-path / -s - 定义要检查 SCSS 导入的附加路径。您可以通过逗号 (,) 分隔多个路径。

• --watcher / -w - 定义一个路径，将 EventSource 指向该路径，并将它注入到您的 JavaScript 中，以便在运行 watch 命令时文件更新时刷新页面。（有关更多信息，请参阅下面的 watch 命令部分）

示例

fec --js-output build/main.min.js js/*.js

fec --css-output build/main.min.css --js-output build/main.min.js scss/*.scss js/*.js

watch 命令

启动一个进程，该进程会监视文件更改并在需要时重新编译它们。此命令将执行一次初始编译，以确保一切是最新的。

监视器

FEC 有能力在运行 watch 命令时自动刷新您的网站（类似于 Browsersync 的工作方式）。只需在网站可访问的地方创建一个 watcher.php（或您想叫什么名字都行），并将以下代码放在那里

<?php
require_once('./vendor/autoload.php');
new FEC_Watcher(array(
  'build/main.min.js' => 'build/main.min.css'
), 'content/themes/my-theme');
?>

FEC_Watcher 类接受两个参数

• $files (String/Array) - 应传递 FEC 将生成或 Array 数组中的 JavaScript 文件的路径。这些文件将由 FEC 注入 JavaScript 以侦听更改。该数组也可以使用 JavaScript 文件作为键和用于更新侦听的附加文件作为值（接受 String 或 Array 字符串）的多维数组。

• $path (String) - $files 参数中使用的所有路径都应相对于监视器脚本的位置。您可以使用此参数定义要预添加到 $files 参数中所有文件的路径。

最后但同样重要的是，您需要将--watcher选项设置为服务器上可以访问监视脚本路径的位置。

如果使用了监视器，您完成操作后，文件将最后一次重新编译，以移除注入的JavaScript。

使用JSON定义设置

您可以通过在JSON文件中定义设置来设置大多数选项，如下所示

{
  "compile": {
    "css": {
      "build/main.min.css": "scss/main.scss"
    }
  },
  "settings": {
    "fec": {
      "compress": true,
      "remove-important-comments": true,
      "scss-import-path": "gpm_modules",
      "watcher": "/watcher.php"
    }
  }
}

scss-import-path设置接受字符串或字符串数组，这些路径相对于JSON文件的当前位置。

相关

• GPM - 一个PHP命令行工具，可以轻松地从GitHub下载依赖项。

许可证

MIT。有关更多信息，请参阅license.md文件。