首页 > 代码库 > vue.js随笔记---初识Vue.js(2)

vue.js随笔记---初识Vue.js(2)

环境搭建(推荐使用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官网的一个首页,这样,接下来就可以在模板的基础上更换上自己的内容啦 希望小伙伴创建成功,过程中遇到问题也希望多多沟通,还请各位大神指教:)

vue.js随笔记---初识Vue.js(2)