サルでもわかるWEBプログラミング

フリーソフトのみでホームページ作成

ユーザ用ツール

サイト用ツール


00.cssフレームワークbulma用テンプレート:elm0.19でbulmaを利用する


差分

このページの2つのバージョン間の差分を表示します。

この比較画面へのリンク

両方とも前のリビジョン前のリビジョン
次のリビジョン
前のリビジョン
00.cssフレームワークbulma用テンプレート:elm0.19でbulmaを利用する [2019/05/04] adash33300.cssフレームワークbulma用テンプレート:elm0.19でbulmaを利用する [2019/05/04] (現在) – [src/Main.elmをmain.jsにコンパイルしてindex.htmlに読み込む] adash333
行 17: 行 17:
 2019年3月28日 2019年3月28日
  
 +ほとんど同じですが、もう少し簡単な方法を以下に記載させていただきました。
  
 ===== 開発環境 ===== ===== 開発環境 =====
行 35: 行 36:
 </code> </code>
 ===== src/Main.elmをmain.jsにコンパイルしてindex.htmlに読み込む ===== ===== src/Main.elmをmain.jsにコンパイルしてindex.htmlに読み込む =====
-詳細は以下:http://i-doctor.sakura.ne.jp/font/?p=37457+元のソースコードは、https://superhahnah.com/elm-flags/ を写経させていただきました。 
 +詳細は以下をご覧ください:http://i-doctor.sakura.ne.jp/font/?p=37457
  
-  -アプリ作成用フォルダを作成 +おおまかな流れ
-  -%%elm init%% +
-  -+
  
-index.html+  -アプリ作成用フォルダを作成(例:C:/elm/elm-flag/) 
 +  -"%%elm init%%"でelm.jsonを作成 
 +  -index.htmlの作成(ここにbulmaとFontAwesome5を読み込む) 
 +  -src/Main.elmの作成 
 +  -"%%elm make src/Main.elm --output=main.js%%"でsrc/Main.elmをmain.jsにコンパイル 
 +  -index.htmlをChromeで開く。 
 + 
 +index.htmlとsrc/Main.elm
 <html> <html>
 <script src="https://gist.github.com/adash333/d85ae4f075cfc387a8f2febe05b0f75a.js"></script> <script src="https://gist.github.com/adash333/d85ae4f075cfc387a8f2febe05b0f75a.js"></script>
-<html>+</html> 
 + 
 +{{:00.cssフレームワークbulma用テンプレート:pasted:20190504-143930.png}} 
 + 
 +DEMOサイト:https://adash333.github.io/elm-bulma-flag/ 
 + 
 + 
 + 
  
  


00.cssフレームワークbulma用テンプレート/elm0.19でbulmaを利用する.1556979431.txt.gz · 最終更新: 2019/05/04 by adash333

Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki