这两天闲了学习了一下vue的知识,从环境开始搭起,遇到了一些坑,这里列出来

初学者都知,要搭建vue要安装node的环境,所以,我们先下载node mac os版 node下载地址

安装都是遵循傻瓜式安装方式,一直下一步就好,安装完成之后在终端执行 **npm -v ** 命令

file

由于node npm是在国外的镜像下使用,是比较慢的,淘宝为我们提供了一套指令,

mac下执行:npm install -g cnpm --registry=https://registry.npm.taobao.org

file

会发现报错了,原因是没有权限在该文件夹下写入文件,需要用root权限

解决办法:执行sudo npm install -g cnpm --registry=https://registry.npm.taobao.org ,输入root账户的密码,成功!

接下来执行命令cnpm install -g vue-cli 安装vue的客户端命令

file

安装完毕

初始化项目: 新建一个html,引入官方提供的vue.js vue.js

然后编辑html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>vue</title>
</head>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<body>

<div id="app">
    <p @click="first">{{ message }}</p>
</div>
</body>

<script>
    var vue = new Vue({
        el: '#app',
        data:{
            message: 'hello world'
        },
        methods:{
            first(){
                console.log(this.message)
            }
        }
    })
</script>
</html>

打开浏览器,运行该html ,得到结果: file

点击helloworld 打印日志 file 初始化成功!