vue快速入门

下载安装VScode
安装三个插件
live server
vetur
Vue.js with Typ…
vue快速入门_第1张图片
配置setting

{
    "editor.formatOnType": true,
    "editor.formatOnSave": true,
    "editor.fontSize": 18,
    "liveServer.settings.donotShowInfoMsg": true,
}

新建项目
在这里插入图片描述
在app.js 实例化vue

// 实例化vue
new Vue({
     
    el: "#vue-app",
    data() {
     
        return {
     
            name: "aaaa",
            qq: "123"
        }
    }
});

index.html内容

安装脚手架
官网安装node.js

安装cnpm

npm install -g cnpm --registry=https://registry.npm.taobao.org

安装webpack
npm install [email protected] -g
webpack -v查看版本号

安装vue-cli脚手架构建工具

npm install vue-cli -g

为了发起api请求,需要用到vue-resource,
在工程文件下面使用终端输入

npm install --save vue-resource

在main.js中加入两行代码

import VueResource from 'vue-resource
Vue.use(VueResource)

你可能感兴趣的:(vue快速入门)