VUEのインストール使用教程の詳細

2469 ワード

インストール使用 vue

簡単で実用的なvueなら、jsファイルを直接引用することができます。
https://vuejs.org/js/vue.js
しかし、大型プロジェクトを構築する際には、NPMを使ってインストールすることを推奨します。NPMは、webpackやBrowserifyモジュールのパッケージングとうまく連携して使用できます。また、Vueはサポートツールを提供して、単一ファイルコンポーネントを開発します。
1.nodejsをインストールする
npmはnodejs package managerですので、まずnodejsをインストールして、公式サイトから該当バージョンをダウンロードしてインストールすればいいです。
インストールしたらコマンドラインツールを開けて、nodeを入力してnodejsのコマンドモードに入ります。
C:\Users\wangjun>node
>1+2
3
>
Ctrl+Cまたは入力を2回押してください。exitは命令を終了してもいいです。
2.タオバオNPMミラーをインストールする
国内でのnpmのインストール速度が遅すぎるため、タオバオミラーとコマンドcnpmを使って各種のバッグをインストールすることができます。
npmをインストールします。npm install -g cnpm --registry=https://registry.npm.taobao.orgインストールが完了したら、後でcnpmコマンドを使ってnpmパッケージをインストールできます。cnpm install {package name}3.VUEの取り付け


#      
cnpm install vue

インストールが完了したら、デフォルトはユーザパスの下にあります。
C:\Users\user_name ode_modules
vueパッケージのdist/カタログではVue.jsの各種バージョンが見られます。ここでminが付いているのは生産環境のバージョンで、開発バージョンvue.jsよりかなり圧縮されています。警告は削除されました。
4.VUEを使用する
新しい3つのファイルのうち、vue.jsはネットからダウンロードする必要があります。
my.
my.js
vue.js
4.1新しいmy.


<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>my html</title>
</head>
<body>
  <div id="app">
    {{message}}
  </div>
</body>
<script type="text/javascript" src="vue.js"></script>
<script type="text/javascript" src="my.js"></script>
</html>

4.2新しいmy.js


var app1 = new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue!'
  }
})

これでvueはインストールと簡単な使用で完成しました。
4.3発生した問題
1）Vue is not definedを間違えました。
Uncaugt ReferenceError：Vue is not defined
at my.js:1
原因
まずmy.jsを引用して、vue.jsを引用しました。
ソリューション
vue.jsを先に引用して、my.jsを引用してmy.jsの中でvueの文法を使うことができます。
2）誤報[Vue warn]：Canot find element：菗ap
[Vue warn]：Canot find element：菗ap
原因
私は関連のjsファイルをheadの中に置いて、ファイルをロードしていないでjsファイルを実行することを招いて、だからjsは〓apが探し出せません。
ソリューション
関連するjsファイルを最後まで置いて、ページのすべてのレンダリングが完了したらjsをロードすることができます。
締め括りをつける
以上述べたのは小编がみんなに绍介したVUEのインストール使用教程の详しい解で、みんなに助けがあることを望んで、もし皆さんは何か疑问があれば、メッセージをください。小编はすぐにみんなに返事します。ここでも私たちのサイトを応援してくれてありがとうございます。

spring学習の創建プロジェクトHello Spring実例コード

Javaはopenofficeを利用してdoc、docxをpdfインスタンスコードに変えます。