安装与引入

March7th UI 支持多种引入方式，可根据项目需求选择。

npm 安装

npm install @mar7th/march7th-ui

完整引入

在 HTML 中引入所有组件和样式：

<!-- 设计 Token -->
      <link rel="stylesheet" href="node_modules/@mar7th/march7th-ui/src/march7th-tokens.css">
      <!-- 组件样式 -->
      <link rel="stylesheet" href="node_modules/@mar7th/march7th-ui/src/march7th-ui.css">
      <!-- 组件脚本 -->
      <script src="node_modules/@mar7th/march7th-ui/src/march7th-components.js" defer></script>

      <!-- 使用组件 -->
      <m7-input label="用户名" required></m7-input>

按需引入

只引入需要的组件（m7-core.js 必须最先加载）：

<link rel="stylesheet" href="node_modules/@mar7th/march7th-ui/src/march7th-tokens.css">
      <link rel="stylesheet" href="node_modules/@mar7th/march7th-ui/src/march7th-ui.css">
      <script src="node_modules/@mar7th/march7th-ui/src/components/m7-core.js" defer></script>
      <script src="node_modules/@mar7th/march7th-ui/src/components/m7-input.js" defer></script>
      <script src="node_modules/@mar7th/march7th-ui/src/components/m7-badge.js" defer></script>

CDN 引入

<link rel="stylesheet" href="https://unpkg.com/@mar7th/march7th-ui/src/march7th-tokens.css">
      <link rel="stylesheet" href="https://unpkg.com/@mar7th/march7th-ui/src/march7th-ui.css">
      <script src="https://unpkg.com/@mar7th/march7th-ui/src/march7th-components.js" defer></script>