The Go Blog

vue初步

bantana
6 November 2017

终于还是要接触下前端了

vue install

https://vuejs.org/
https://cn.vuejs.org/v2/guide/index.html
  • brew install node
  • brew install yarn
  • npm search vue-cli
  • yarn global add vue-cli

建立一个vue project

$ vue init webpack vueproj1
$ cd vueproj1
$ yarn install
$ yarn run dev

vue-cli project 启动监听端口

find ./ -type f | xargs -I{} grep -inR 8080 {}

.//config/index.js:30:    port: process.env.PORT || 8080,

vue 第一个程序(先不使用vue-cli)

$ mkdir vuefirst
$ cd vuefirst
$ nvim index.html

在head中引入vue

<script src="https://unpkg.com/vue" type='application/javascript'></script>

在body中引入

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

在html中写入应用

<script type='application/javascript'>
var app = new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue!'
  }
})
</script>

好了第一个应用写完了,这个vue应用在浏览器打开的时候,显示结果是

Hello vue!

Related articles