Vue2-Vue开发环境搭建

一、IDE编辑器Vscode自行下载安装即可

二、三种引入方式 教程使用方式一引入

Vue官网https://v2.cn.vuejs.org/v2/guide/installation.html

方式一直接script引入

教程下载开发版本下载到本地放到对应的文件中即可。

生产版本是开发版本的压缩版删除了警告功能等。

在script标签中引入注意文件目录结构

 

方式二CDN在线引入使用需要外网环境

 

方式三NPM安装

初学者不建议使用NPM因为NPM一般需要配合vue-cli脚手架进行综合项目开发比较复杂待有了基础之后后续会讲解。

 三、安装之后验证

安装之后实际上会引入一个Vue大对象chrome浏览器打开网页

 打开网页之后F12打开console控制台输入Vue回车,就可以看到Vue对象函数

 当我们注释掉引入vue时候会出现报错

 但是当我们都配置完成之后控制会出现一下警告提示

 第一条为了更好的开发体验请下载Vue开发工具点击下面链接进入chrome商城进行安装但是国内一般访问不了chrome商城这里提供了离线安装方法百度网盘下载

Vue.crx下载       提取码6666

一、Chrome浏览器安装方式
①点击右上角三个点
②点击更多工具
③点击扩展程序
④点击右上角的开发者模式将他启用
⑤将下载的Vue.crx文件直接拖动到浏览器窗口即可

第二条意思是你在使用开发者模式但是当你切换到生产环境不可以使用开发者模式的Vue这是提示不是错误。

官网上可以看到

在浏览器中查看验证

 

 

至此环境搭建完毕