Skip to content
Mithril.js 2
Main Navigation 指南API

简体中文

English
繁體中文
Español
Français
Русский
Português – Brasil
Deutsch
日本語
한국어
Italiano
Polski
Türkçe
čeština
magyar

简体中文

English
繁體中文
Español
Français
Русский
Português – Brasil
Deutsch
日本語
한국어
Italiano
Polski
Türkçe
čeština
magyar

主题

Sidebar Navigation

入门

安装

简单应用

资源

JSX

在旧版浏览器上使用 ES6+

动画

测试

示例

第三方库集成

路径处理

关键概念

虚拟 DOM

组件

生命周期方法

键(Key)

自动重绘系统

杂项

框架对比

从 v1.x 迁移

从 v0.2.x 迁移

API

页面导航

安装 ​

CDN 和在线实验场 ​

如果你是 JavaScript 新手,或者只是想用最简单的方式快速上手,可以通过 CDN 引入 Mithril.js:

html
<script src="https://unpkg.com/mithril/mithril.js"></script>

如果你想在无需配置本地环境的情况下体验 Mithril.js,可以使用 flems.io/mithril 提供的在线实验场。

npm ​

bash
$ npm install mithril

Mithril.js 的 TypeScript 类型定义文件可以通过 DefinitelyTyped 获取。 使用以下命令安装:

bash
$ npm install @types/mithril --save-dev

本地创建项目 ​

你可以使用一些现有的 Mithril.js 启动模板,例如:

  • mithril-vite-starter
  • mithril-esbuild-starter
  • mithril-rollup-starter

例如,如果你想使用 mithril-esbuild-starter 作为起点,请执行以下命令:

bash
# 克隆模板到指定目录
npx degit kevinfiol/mithril-esbuild-starter hello-world

# 进入新创建的项目目录
cd ./hello-world/

# 安装依赖
npm install

# 构建应用并监听文件更改
npm run dev

使用 esbuild 快速开始 ​

esbuild 的文档可以在这里找到。

  1. 初始化目录为一个 npm 项目。
bash
$ npm init --yes
  1. 安装必要的工具。
bash
$ npm install mithril
$ npm install esbuild --save-dev
  1. 在 package.json 文件的 scripts 部分添加 "start" 脚本。

    json
    {
      "...": "...",
      "scripts": {
        "start": "esbuild index.js --bundle --outfile=bin/main.js --watch"
      }
    }

    可选:如果需要使用 JSX,可以将 --jsx-factory 和 --jsx-fragment 标志与 esbuild 一起使用。

    json
    {
      "...": "...",
      "scripts": {
        "start": "esbuild index.js --bundle --outfile=bin/main.js --jsx-factory=m --jsx-fragment='\"[\"' --watch"
      }
    }
  2. 创建 index.js 文件。

javascript
import m from 'mithril';
m.render(document.getElementById('app'), 'hello world');
  1. 创建 index.html 文件。
html
<!DOCTYPE html>
<body>
  <div id="app"></div>
  <script src="bin/main.js"></script>
</body>
  1. 运行打包脚本。
bash
$ npm run start
  1. 在浏览器中打开 index.html。你应该能在页面上看到 hello world。
Pager
下一页简单应用

基于 MIT 许可证 发布。

版权所有 (c) 2024 Mithril Contributors

https://mithril.js.org/installation.html

基于 MIT 许可证 发布。

版权所有 (c) 2024 Mithril Contributors