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

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

ユーザ用ツール

サイト用ツール


00.vue用デザインフレームワークvuetify:01.codesandboxのvue.jsでvuetify


差分

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

この比較画面へのリンク

両方とも前のリビジョン前のリビジョン
最新のリビジョン両方とも次のリビジョン
00.vue用デザインフレームワークvuetify:01.codesandboxのvue.jsでvuetify [2018/12/18] – [index.htmlとsrc/App.vueとsrc/main.jsの編集] adash33300.vue用デザインフレームワークvuetify:01.codesandboxのvue.jsでvuetify [2018/12/18] – [解説] adash333
行 65: 行 65:
 Vue.jsにVuetifyを導入するためには、以下の3つが必要です。 Vue.jsにVuetifyを導入するためには、以下の3つが必要です。
  
-  -Vuetifyをnpm install+  -Vuetifyをnpm install(CodeSandboxでは、Add DependencyからVuetifyをインストール)
   -index.htmlの<head></head>内に、"Material+Icons"を読み込む   -index.htmlの<head></head>内に、"Material+Icons"を読み込む
   -src/main.jsで、vuetifyとvuetify.cssをimportして、Vue.use(Vuetify);する。   -src/main.jsで、vuetifyとvuetify.cssをimportして、Vue.use(Vuetify);する。
  
 +index.htmlの追加コード
 +<code>
 +// </head>の直前に以下を挿入
 +<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Material+Icons" rel="stylesheet"/>
 +</code>
 +
 +src/main.jsの追加コード
 <code> <code>
 import Vuetify from "vuetify"; import Vuetify from "vuetify";


00.vue用デザインフレームワークvuetify/01.codesandboxのvue.jsでvuetify.txt · 最終更新: 2018/12/18 by adash333

Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki