vndb/mithril-vndb
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

docs: update with latest fixes (#2116)

Browse source
This commit is contained in:
Pat Cavit 2018-04-12 00:11:11 -07:00 • committed by GitHub
parent b9f65c2fdd
commit 6fb77b7771
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
28 changed files with 276 additions and 89 deletions
Download patch file Download diff file Expand all files Collapse all files

91
docs/installation.md
View file

@ -2,6 +2,8 @@
- [CDN](#cdn)
- [NPM](#npm)
- [Quick start with Webpack](#quick-start-with-webpack)
- [TypeScript](#typescript)
### CDN
@ -15,30 +17,57 @@ If you're new to Javascript or just want a very simple setup to get your feet we
### NPM
#### Quick start with Webpack
```bash
# 1) install
npm install mithril --save
npm install webpack --save
# 2) add this line into the scripts section in package.json
# "scripts": {
# "start": "webpack src/index.js bin/app.js --watch"
# }
# 3) create an `src/index.js` file
# 4) create an `index.html` file containing `<script src="bin/app.js"></script>`
# 5) run bundler
npm start
# 6) open `index.html` in the (default) browser
open index.html
$> npm install mithril --save
```
---
### Quick start with Webpack
1. Initialize the directory as an npm package
```bash
$> npm init --yes
```
2. install required tools
```bash
$> npm install mithril --save
$> npm install webpack webpack-cli --save-dev
```
3. Add a "start" entry to the scripts section in `package.json`.
```js
{
// ...
"scripts": {
"start": "webpack src/index.js --output bin/app.js -d --watch"
}
}
```
3. Create `src/index.js`
```js
import m from "mithril";
m.render(document.body, "hello world");
```
4. create `index.html`
```html
<!DOCTYPE html>
<body>
<script src="bin/app.js"></script>
</body>
```
5. run bundler
```bash
$> npm start
```
6. open `index.html` in a browser
#### Step by step
For production-level projects, the recommended way of installing Mithril is to use NPM.
@ -78,7 +107,7 @@ Most browser today do not natively support modularization systems (CommonJS or E
A popular way for creating a bundle is to setup an NPM script for [Webpack](https://webpack.js.org/). To install Webpack, run this from the command line:
```bash
npm install webpack --save-dev
npm install webpack webpack-cli --save-dev
```
Open the `package.json` that you created earlier, and add an entry to the `scripts` section:
@ -87,7 +116,7 @@ Open the `package.json` that you created earlier, and add an entry to the `scrip
{
"name": "my-project",
"scripts": {
"start": "webpack src/index.js bin/app.js -d --watch"
"start": "webpack src/index.js --output bin/app.js -d --watch"
}
}
```
@ -149,8 +178,8 @@ If you open bin/app.js, you'll notice that the Webpack bundle is not minified, s
{
"name": "my-project",
"scripts": {
"start": "webpack src/index.js bin/app.js -d --watch",
"build": "webpack src/index.js bin/app.js -p",
"start": "webpack src/index.js --output bin/app.js -d --watch",
"build": "webpack src/index.js --output bin/app.js -p",
}
}
```
@ -231,3 +260,15 @@ If you don't have the ability to run a bundler script due to company security po
// if a CommonJS environment is not detected, Mithril will be created in the global scope
m.render(document.body, "hello world")
```
---
### TypeScript
TypeScript type definitions are available from DefinitelyTyped. They can be installed with:
```bash
$> npm install @types/mithril --save-dev
```
For example usage, to file issues or to discuss TypeScript related topics visit: https://github.com/MithrilJS/mithril.d.ts