码迷,mamicode.com
首页 > Web开发 > 详细

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

时间:2017-04-22 00:02:29      阅读:229      评论:0      收藏:0      [点我收藏+]

标签:reg   依赖库   nod   名称   cnp   --   init   脚手架   taobao   

环境搭建(推荐使用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)

标签:reg   依赖库   nod   名称   cnp   --   init   脚手架   taobao   

原文地址:http://www.cnblogs.com/max-tlp/p/6746474.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!