Kurulum

CDN ve çevrimiçi oyun alanı

JavaScript'e yeni başladıysanız veya sadece basit bir kurulumla denemek istiyorsanız, Mithril.js'yi bir İçerik Dağıtım Ağı (CDN) üzerinden kullanabilirsiniz:

html

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

Mithril.js'yi yerel bir ortam kurmadan denemek için flems.io/mithril adresindeki çevrimiçi oyun alanını kullanabilirsiniz.

npm

bash

$ npm install mithril

TypeScript tip tanımları DefinitelyTyped'da bulunmaktadır. Aşağıdaki komut ile kurabilirsiniz:

bash

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

Yerel bir proje oluşturma

Aşağıdaki Mithril.js başlangıç şablonlarından birini kullanabilirsiniz:

Örneğin, mithril-esbuild-starter ile başlamak için aşağıdaki komutları çalıştırın:

bash

# Şablonu istediğiniz bir dizine klonlayın
npx degit kevinfiol/mithril-esbuild-starter hello-world

# Oluşturduğunuz projeye gidin
cd ./hello-world/

# Bağımlılıkları yükleyin
npm install

# Uygulamayı derleyin ve değişiklikleri izleyin
npm run dev

esbuild ile hızlı başlangıç

esbuild belgelerine buradan ulaşabilirsiniz.

Bir dizini npm paketi olarak başlatın.

bash

$ npm init --yes

Gerekli araçları yükleyin.

bash

$ npm install mithril
$ npm install esbuild --save-dev

package.json dosyasındaki scripts bölümüne bir "start" girdisi ekleyin.

json

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

İsteğe bağlı olarak, JSX kullanmak isterseniz, esbuild ile --jsx-factory ve --jsx-fragment parametrelerini kullanabilirsiniz.

json

{
  "...": "...",
  "scripts": {
    "start": "esbuild index.js --bundle --outfile=bin/main.js --jsx-factory=m --jsx-fragment='\"[\"' --watch"
  }
}

index.js dosyasını oluşturun.

javascript

import m from 'mithril';
m.render(document.getElementById('app'), 'hello world');

index.html dosyasını oluşturun.

html

<!DOCTYPE html>
<body>
  <div id="app"></div>
  <script src="bin/main.js"></script>
</body>

Paketleyici betiğini çalıştırın.

bash

$ npm run start

index.html dosyasını bir tarayıcıda açın. Sayfada hello world yazısını görmelisiniz.

Kurulum ​

CDN ve çevrimiçi oyun alanı ​

npm ​

Yerel bir proje oluşturma ​

esbuild ile hızlı başlangıç ​

Kurulum

CDN ve çevrimiçi oyun alanı

npm

Yerel bir proje oluşturma

esbuild ile hızlı başlangıç