访问官网
Github
文档Alpine.js
大多数内容请参考 Alpine 文档：Alpine 文档
欢迎您通过向本仓库提交 PR 来更新文档。文档位于 /packages/docs 目录中。
请继续阅读以获取贡献相关信息。
寻找 V2 文档？在这里
贡献指南：
快速开始
- 在本地克隆此仓库
- 运行
npm install和npm run build - 在网页上通过
<script>标签引入/packages/alpinejs/dist/cdn.js文件，就可以开始使用了！
简要介绍
克隆仓库到本地后，您可以在根目录运行 npm install 安装所有依赖。
这个仓库是一个使用 npm 工作区管理包的"单体仓库"。每个包都有自己的文件夹，位于 /packages 目录中。
无需为每个包单独运行构建，所有包的打包都可以通过同一个命令完成：npm run build
以下是本仓库中每个包的简要说明：
| 包名 | 描述 |
|---|---|
| alpinejs | Alpine 的主仓库，包含 Alpine 的所有核心内容 |
| collapse | 用于平滑动画展开和折叠元素的插件 |
| csp | 提供 Alpine 的"CSP 安全"构建的仓库 |
| docs | Alpine 文档 |
| focus | 允许您在元素内管理焦点的插件 |
| history | 使用历史 API 将数据绑定到查询字符串参数的插件（名称可能会更改） |
| intersect | 基于元素与视口相交触发 JS 表达式的插件 |
| mask | 在用户输入时自动格式化文本输入字段的插件 |
| morph | 智能地在页面内部变形 HTML（类似 morphdom）的插件 |
| persist | 在页面加载之间保持 Alpine 状态的插件 |
运行 npm run [build/watch] 后编译的 JS 文件存储在每个包的 packages/[package]/dist 目录中，可以通过 <script> 标签引入。
每个包至少应该有：一个自初始化的"cdn"构建，可以在 <script defer> 标签的 src 属性中使用，以及用于导入 JS 模块的 module.[esm/cjs].js 文件（cjs 用于 node，esm 用于其他环境）。
Alpine V3 的打包完全由 ESBuild 处理。所有这些构建的配置都存储在 scripts/build.js 文件中。
测试
本仓库使用两种不同的测试工具：Cypress（用于集成测试）和 Jest（用于单元测试）。
所有测试都存储在 /tests 文件夹下的 /tests/cypress 和 /tests/jest 中。
您可以使用以下命令从命令行运行它们：npm run test
如果您只想运行 Cypress 并打开其用户界面（开发期间推荐），可以运行：npm run cypress
如果您只想运行 Jest 测试，可以像平常一样运行 npm run jest 并指定特定测试。您可以使用 -- 指定要转发给 jest 命令的命令行配置选项，例如：npm run jest -- --watch
