00.cssフレームワークbulma用テンプレート:elm0.19でbulmaを利用する
差分
このページの2つのバージョン間の差分を表示します。
次のリビジョン | 前のリビジョン | ||
00.cssフレームワークbulma用テンプレート:elm0.19でbulmaを利用する [2019/03/24] – 作成 adash333 | 00.cssフレームワークbulma用テンプレート:elm0.19でbulmaを利用する [2019/05/04] (現在) – [src/Main.elmをmain.jsにコンパイルしてindex.htmlに読み込む] adash333 | ||
---|---|---|---|
行 3: | 行 3: | ||
方法はいろいろあります。 | 方法はいろいろあります。 | ||
- | 2つの方法について、以下に記載させていただきました。個人的には、(2)の方がお勧めです。 | + | 2つの方法について、以下に記載させていただきました。[[http:// |
http:// | http:// | ||
行 12: | 行 12: | ||
Elm0.19でCSSフレームワーク”bulma”を試してみる(2)(create-elm-appでelmアプリを作成) | Elm0.19でCSSフレームワーク”bulma”を試してみる(2)(create-elm-appでelmアプリを作成) | ||
2019年3月24日 | 2019年3月24日 | ||
+ | |||
+ | http:// | ||
+ | create-elm-appでbulmaとfontawesome5を試してみる | ||
+ | 2019年3月28日 | ||
+ | |||
+ | ほとんど同じですが、もう少し簡単な方法を以下に記載させていただきました。 | ||
+ | |||
+ | ===== 開発環境 ===== | ||
+ | Windows 10 Pro | ||
+ | Chrome | ||
+ | VisualStudioCode 1.32.3 | ||
+ | git version 2.20.1.windows.1 | ||
+ | nvm 1.1.7 | ||
+ | node 10.2.0 | ||
+ | npm 6.4.1 | ||
+ | elm 0.19.0 | ||
+ | elm-format 0.8.1 | ||
+ | VisualStudioCodeの拡張機能でelmをインストールして、settings.jsonに以下のようにelmを設定 | ||
+ | < | ||
+ | " | ||
+ | " | ||
+ | }, | ||
+ | </ | ||
+ | ===== src/ | ||
+ | 元のソースコードは、https:// | ||
+ | 詳細は以下をご覧ください:http:// | ||
+ | |||
+ | おおまかな流れ | ||
+ | |||
+ | -アプリ作成用フォルダを作成(例:C:/ | ||
+ | -" | ||
+ | -index.htmlの作成(ここにbulmaとFontAwesome5を読み込む) | ||
+ | -src/ | ||
+ | -" | ||
+ | -index.htmlをChromeで開く。 | ||
+ | |||
+ | index.htmlとsrc/ | ||
+ | < | ||
+ | <script src=" | ||
+ | </ | ||
+ | |||
+ | {{: | ||
+ | |||
+ | DEMOサイト:https:// | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | ===== リンク ===== | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
00.cssフレームワークbulma用テンプレート/elm0.19でbulmaを利用する.1553434609.txt.gz · 最終更新: 2019/03/24 by adash333