安装

¥Installation

这些 XState v4 文档不再维护

XState v5 现已推出！阅读有关 XState v5 的更多信息 (opens new window)

¥XState v5 is out now! Read more about XState v5 (opens new window)

🆕 在我们的新文档中查找有关 安装 XState (opens new window) 的更多信息。

¥🆕 Find more about installing XState (opens new window) in our new docs.

你可以从 NPM 或 Yarn 安装 XState，也可以直接从 CDN 嵌入 <script>。

¥You can install XState from NPM or Yarn, or you can embed the <script> directly from a CDN.

包管理器

¥Package Manager

npm install xstate@latest --save
# or:
yarn add xstate@latest --save

CDN

你可以直接从 解包 CDN (opens new window) 包含 XState：

¥You can include XState directly from the unpkg CDN (opens new window):

• XState 核心：https://unpkg.com/xstate@4/dist/xstate.js (opens new window)

  ¥XState core: https://unpkg.com/xstate@4/dist/xstate.js (opens new window)

• XState Web：https://unpkg.com/xstate@4/dist/xstate.web.js (opens new window)

  • 浏览器友好的 ES 模块构建

    ¥Browser-friendly, ES module build

<script src="https://unpkg.com/xstate@4/dist/xstate.js"></script>

变量 XState 将在全局范围内可用，这将使你能够访问顶层导出。

¥The variable XState will be available globally, which will give you access to the top-level exports.

const { createMachine, actions, interpret } = XState; // global variable: window.XState

const lightMachine = createMachine({
  // ...
});

const lightService = interpret(lightMachine);