npmでvue.jsのHallo world !

公式Document読んでてちょっと分かりづらかったので個人的なメモです。
npmについては省略。

npm install

mkdir npm-vue-study
cd npm-vue-study
npm install vue

中身

touch index.html
index.htmlの中身

<div id="app">
  <p>{{ message }}</p>
</div>

<script src="./node_modules/vue/dist/vue.js"></script>
<script src="index.js"></script>

touch index.js
index.jsの中身

new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue.js!'
  }
})

参考: https://jsfiddle.net/chrisvfritz/50wL7mdz/

/vue/dist以下にビルドのバラエティが色々おいてあるので必要なものhtmlで呼び出す。
さまざまなビルドについて

追記
上のJSだとコンソールでapp.messageの値を変えても変わんないので以下に変更。
var app = new Vue({
el: #app,
data: {
message: ‘Hello Vue.js!’
}
})

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

This site uses Akismet to reduce spam. Learn how your comment data is processed.