vue.js随笔记---初识Vue.js

Posted 2020-09-12

环境搭建（推荐使用vue.js官方提供的命令行工具，用于快速搭建大型单页面应用，包含：vue.js的一个框架爱，vue.js打包工具，测试的工具，开发调试的服务器等）：

1、npm:node.js的一个包管理工具，npm在国内使用会很慢，可以使用淘宝镜像:

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

cnpm安装成功检测：cnpm -v回车可看到版本号则表示安装成功！

2、vue-cli安装（vue-cli相当于脚手架，可以帮你自动生成模板工程）

cnpm install -g vue-cli

苹果电脑若有权限问题则使用下面的方法（命令前加上"sudo"）：

sudo cnpm install -g vue-cli

vue-cli安装成功校验：再次输入vue时，不再提示不是内部命令，而是能看到vue本身变成了一种命令

3、创建一个基于“webpack”压缩和打包的一个项目，需要创建项目的目录下打开cmd：

vue init webpack my-project

创建过程中全部输入"y"进行确认，项目名称和描述可以自行输入.

4、创建成功后可在选择的文件夹里看到vue帮助你创建好的一个项目，将cmd进入到该项目中，安装项目开发依赖：

cnpm install

安装成功后项目目录中的node_modules文件夹中将出现很多依赖库（具体安装了哪些依赖可到项目根目录下的package.json中查看）

5、项目运行：

cnpm run dev

vue会起一个服务，在浏览器中打开当前项目，在项目编辑过程中，只需要保存，页面上不需要刷新就会更新相应的内容，这就是vue脚手架提供的功能之一。

 

vue创建的模板项目是vue官网的一个首页，这样，接下来就可以在模板的基础上更换上自己的内容啦 希望小伙伴创建成功，过程中遇到问题也希望多多沟通，还请各位大神指教:)