Svelteは、新しいJavaScriptフレームワーク
Reactを使用したことがあるので、ちょっと理解していました。
しかし、Svelteについては、フロント業界で話題になっている程度しか聞いたことがありませんでした。
馬鹿な私は試してみないとわからないので入門してみました
いつものhello worldです
$ npx degit sveltejs/template my-svelte-project
npx: 32個のパッケージを8.653秒でインストールしました。
cloned sveltejs/template#master to my-svelte-project
$ cd my-svelte-project
$ npm install
npm WARN deprecated fsevents@1.2.9: One of your dependencies needs to upgrade to fsevents v2: 1) Proper nodejs v10+ support 2) No more fetching binaries from AWS, smaller package size
npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN svelte-app@1.0.0 No repository field.
npm WARN svelte-app@1.0.0 No license field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
added 190 packages from 168 contributors and audited 2217 packages in 19.389s
found 0 vulnerabilities
$ npm run dev
rollup -c -w
rollup v1.27.5
bundles src/main.js → public\build\bundle.js...
LiveReload enabled
created public\build\bundle.js in 456ms
svelte-app@1.0.0 start my-svelte-project
sirv public "--dev"
Your application is ready~! 🚀
- Local: http://localhost:5000
────────────────── LOGS ──────────────────
インストールされたフォルダは以下のような形でした
当たり前ですが普通に表示されました
reactと違ってインストールは軽いな～
自分の理解が浅いのですが
main.jsからApp.svelteを呼びだしているようです
でpublicにあるindex.htmlをテンプレートとして描画しているようでした
vscodeのアドオンもあるもよう～
https://marketplace.visualstudio.com/items?itemName=JamesBirtles.svelte-vscode
https://marketplace.visualstudio.com/items?itemName=ardenivanov.svelte-intellisense
https://marketplace.visualstudio.com/items?itemName=fivethree.vscode-svelte-snippets
わからない事
まだ理解できていない所がいっぱいあるので
チュートリアルをやっていきます
チュートリアルが終わったらreactとの比較したブログがあるので
そちらを参考したいと思う
