JavaScript Library – Svelte

前言

上一回我介绍了 Alpine.js。作为我开发企业网站 draft 版本的 render engine。

用了一阵子后，我觉得它真的非常不好用。所以打算换一个。

前端有好几个 framework / library / compiler 都可以用来做 MVVM render engine。比如 Angular、React、Vue、LIt、Solid、Qwik、Svelte。

Angular 太重

React、Solid、Qwik 我不爱 JSX

Vue 半吊子

Lit 我不能接受 html`` 语法

所以最后选了 Svelte。

安装

它有 2 个用法，第一个是搭配 SvelteKit，类似于 Angular CLI，官方出的脚手架。

另一个方法是搭配 Vite，我是要轻巧的，自然是不想引入多一个 SvelteKit 概念，用 Vite 足也。

Vite 我之前介绍过了，没用过的人可以先看这篇。

yarn create vite

 然后填写 project name 选择 Svelte 模板和 TypeScript

进入 folder 安装 node_modules 就可以了

cd play-svelte
yarn install
yarn dev --open

效果

vite config with svelte

我们看看是怎样 config svelte to vite 的

首先 vite.config.ts 多了一个 svelte plugin

 多了一个 svelte.config.js 里面是 vite plugin

这样一来一往，两家就连上了。

还有一个重要的是 tsconfig.json

大致上是这样。