1.svelte介绍
Svelte 是一种全新的构建用户界面的方法。传统框架如 React 和 Vue 在浏览器中需要做大量的工作,而 Svelte 将这些工作放到构建应用程序的编译阶段来处理。
与使用虚拟(virtual)DOM 差异对比不同。Svelte 编写的代码在应用程序的状态更改时就能像做外科手术一样更新 DOM。
说人话:就是vue和react框架在打包之后都需要依赖相对于的runtime,而svelte直接编译成原生js代码,不需要依赖额外的runtime。
vue | react | svelte |
---|---|---|
虚拟dom+依赖vue runtime | 虚拟dom+依赖react runtime | 真实dom+不需要依赖runtime |
2.创建项目
npx degit sveltejs/template svelte-demo
3.Hello,World
创建src/main.js
import App from './App.svelte';
const app = new App({target: document.body});
export default app;
创建src/App.svelte
<h1>Hello,World!</h1>
4.启动项目
npm run dev