AssetGraph-builder 技术文档

1. 安装指南

在开始使用 AssetGraph-builder 之前，您需要确保已经安装了 Node.js 和 npm（Node.js 的包管理器）。以下是安装步骤：

• 对于图像处理和优化功能的完整支持，您需要在 Ubuntu 上安装以下库和命令行工具：

  sudo apt-get install -y graphicsmagick inkscape
  

  或者在 OS X 上，使用 homebrew：

  brew install graphicsmagick
  brew install vips --with-webp --with-graphicsmagick
  brew cask install xquartz
  brew cask install inkscape
  

  并将以下命令添加到您的 .profile 或 .bashrc 文件中以使 Inkscape 工作：

  export PKG_CONFIG_PATH=/opt/X11/lib/pkgconfig
  

• 确保您的系统上安装了 Node.js 和 npm。

• 使用 npm 安装 AssetGraph-builder：

  npm install -g assetgraph-builder
  

安装完成后，buildProduction 脚本将被添加到您的系统路径中。

2. 项目的使用说明

使用 AssetGraph-builder，您可以轻松地构建和优化单页网页应用程序。以下是基本使用方法：

buildProduction -o outputPath [--root webrootPath] [startingAssets]

• -o 选项用于指定构建文件的输出目录。
• --root 选项允许您指定一个网页根目录以正确解析 URL，如果未指定，AssetGraph 将尝试自动推断。
• startingAssets 是构建过程的起始点，可以是文件路径或 minimatch 模式。

默认情况下，AssetGraph 会从 index.html 开始构建，但您可以根据需要添加其他文件。

更多选项可以通过 buildProduction -h 命令获取。

3. 项目API使用文档

AssetGraph-builder 的 API 使用是基于命令行参数的。以下是一些常用的参数：

• --cdnroot：指定 CDN 根目录，用于在构建过程中重写资源引用。
• --browsers：指定要支持的浏览器列表，以调整构建过程。
• --manifest：为每个 HTML 页面添加缓存清单。
• --contentsecuritypolicy：更新现有内容安全策略 meta 标签。
• --subresourceintegrity：为每个 <script> 和 <link> 标签添加 integrity 属性。

4. 项目安装方式

项目的安装方式已在“安装指南”部分详细说明。简要概括如下：

• 确保系统上安装了 Node.js 和 npm。

• 使用以下命令全局安装 AssetGraph-builder：

  npm install -g assetgraph-builder
  

这样，您就可以在命令行中使用 buildProduction 命令来构建和优化您的网页应用了。