Mint 🌿 用于编写单页应用程序（SPA）的编程语言

介绍

大家好！👋 今天，我将为大家讲述Mint语言的故事。这门非常年轻（但很有趣）的编程语言专注于构建SPA （单页应用程序）。它拥有编写无错误、易读且易于维护的应用程序所需的所有工具，并且速度创下了历史记录。

印象深刻吗？我也是！我们一起解决吧……😉

📝 目录

Mint lang 到底是什么？
- 为什么不用 JavaScript？
- 为什么不是 Elm？
为什么选择 Mint？
Mint 工具和生态系统
最终结果

Mint lang 到底是什么？

首先，Mint在Crystal上写道：

[...] 一种通用的、面向对象的编程语言 [...] 其语法受到 Ruby 语言的启发 [...] 它是一种具有静态类型检查的编译语言，但通常不需要指定变量或方法参数的类型。

— 维基百科

接下来，按照官方的Mint 指南进行操作：

Mint 是专为编写单页应用程序而创建的语言。它集编译器和框架于一体，能够提供卓越的开发者体验，同时帮助开发者编写安全、可读且易于维护的代码。

是的，确实如此！看看这段代码（抱歉代码高亮了）：

// src/App.mint

component Counter {
  state counter : Number = 0

  fun increment : Promise(Never, Void) {
    next { counter = counter + 1 }
  }

  fun decrement : Promise(Never, Void) {
    next { counter = counter - 1 }
  }

  fun render : Html {
    <div>
      <button onClick={decrement}>
        "Decrement"
      </button>

      <span>
        <{ Number.toString(counter) }>
      </span>

      <button onClick={increment}>
        "Increment"
      </button>
    </div>
  }
}

与严格类型化的语言非常相似，但包含 JSX 风格，对吗？

[...] 它的诞生源于对 JavaScript 语言和生态系统（NPM）以及 Elm 语言的失望以及它不那么开放的开发实践。

好的！👌让我们马上决定：为什么不使用JavaScript，以及Elm 有什么问题。

为什么不用 JavaScript？

JavaScript 不是强类型语言，这使得编写无错误的代码变得困难，并且导致开发人员的体验不太好。

此外，它没有开箱即用地创建 Web 应用程序的工具，您需要框架和编译器以及增加复杂性的构建工具。

为什么不是 Elm？

Elm 拥有丰富的开发人员经验，但作为一种纯函数式语言，它会产生一些样板代码，使其更难学习。

此外，也不可能以任何有意义的方式对语言做出贡献或产生影响。

为什么选择 Mint lang？🤔

Mint 旨在结合 Elm 的开发人员经验和 React 的表现力，创建用于构建单页应用程序的完美语言。

经过一年的开发，Mint具备以下特点：

良好的类型系统
很好的错误消息
格式化程序
组合组件
数据存储商店
内置样式
内置路由
出色的 JavaScript 互操作性
不可变的数据结构

Mint 工具和生态系统

如果没有一个启动和开发的生态系统，我根本不会谈论这门编程语言。所以！😎

编辑器扩展

VS Code — 添加语法高亮和自动完成支持
Emacs — 使用 mint 格式添加语法高亮和自动格式化
IntelliJ IDEA — 添加语法高亮
Atom — 添加语法高亮
Vim — 非常小（但有效）的语法/ftdetect 组合

命令行界面

通过命令安装Mint CLI：

# For macOS:
$ brew tap homebrew-community/alpha
$ brew install mint-lang

# For Linux:
$ wget --no-verbose -O mint https://mint-lang.s3-eu-west-1.amazonaws.com/mint-latest-linux
$ chmod +x ./mint
$ sudo mv ./mint /usr/local/bin/mint

现在，通过使用--help标志调用 Mint 来查看所有命令：

$ mint --help

Mint - Help
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Usage:
  mint [flags...] [arg...]

Mint

Flags:
  --env, -e (default: "")  # Loads the given .env file
  --help                   # Displays help for the current command.

Subcommands:
  build                    # Builds the project for production
  docs                     # Starts the documentation server
  format                   # Formats source files
  init                     # Initializes a new project
  install                  # Installs dependencies
  loc                      # Counts Lines of Code
  start                    # Starts the development server
  test                     # Runs the tests
  version                  # Shows version
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

分散式包管理

此页面包含您可以在项目中使用的软件包：

https://www.mint-lang.com/packages

路由

应用程序的路由在顶层使用routes块定义。请记住以下几点：

路由按照从上到下定义的顺序进行匹配
每个应用程序的路由只能有一个路由块
路由用于设置状态，而不是渲染事物

示例代码：

routes {
  / {
    Application.setPage("index")
  }

  /users/:id (id: Number) {
    sequence {
      Application.setPage("show")
      Application.loadUser(id)
    }
  }

  /blog {
    Application.setPage("blog")
  }

  /blog/:slug (slug: String) {
    sequence {
      Application.setPage("post")
      Application.loadPost(slug)
    }
  }
}

CSS 样式

在Mint组件中，可以使用标识符定义样式，然后使用标识符作为 CSS 类应用于 HTML。

样式可以包含任意数量的 CSS 定义、子规则、媒体查询if和case语句。

示例代码：

component Main {
  style button {
    background: red;
    color: white;
    border: 0;
  }

  fun render : Html {
    <button::button>
      "Click ME!"
    </button>
  }
}

最终结果

之后mint build，你就拥有了可用于生产的Preact SPA。就是这样！🎉

摄影：

[标题] Ben Kolde https://unsplash.com/photos/H29h6a8j8QM
[1] Mint 作者https://www.mint-lang.com
[2] Anthony Fomin https://unsplash.com/photos/Hr6dzqNLzhw

聚苯乙烯

如果你想在本博客上看到更多类似的文章，请在下方留言并订阅我。谢谢！😻

❗️ 您可以在Boosty上支持我，可以是永久支持，也可以是一次性支持。所有收益都将用于支持我的开源项目，并激励我为社区创作新的产品和文章。

当然，你也可以帮助我改善开发者的生活！只需以贡献者的身份连接到我的一个项目即可。非常简单！

我的主要项目需要您的帮助（和星星）👇

🔥 gowebly：下一代 CLI 工具，可轻松使用 Go 在后端创建出色的 Web 应用程序，使用 htmx、hyperscript 或 Alpine.js 以及前端最流行的 CSS 框架。
✨ create-go-app：通过运行一个 CLI 命令，创建一个具有 Go 后端、前端和部署自动化的新的生产就绪项目。

我的其他小项目：yatr、gosl、json2csv、csv2api。

文章来源：https://dev.to/koddr/mint-the-programming-language-for-writing-single-page-applications-spa-3en4