Web前端之路Vue.js专区前端杂货铺

Vue纯小白的入门体验

2017-01-11  本文已影响400人  MrLmomo

接触VUE差不多一个月左右,开始的时候各种懵逼啊,不过入门了之后觉得真心还不错,古人云:“独乐乐,不如众乐乐”,所以今天和大家分享下我的学习经验;

安装NODE环境

Vue-cli 是基于node下运行的,所以在使用Vue-cli之前一定要安装好node环境,具体的方法可以度娘,很简单;推荐node安装教程

使用Vue-cli脚手架新进项目

在命令行下找到你想要存放项目的目录或文件夹,执行vue init webpack yourname,yourname是你要新建项目的名称,也就是文件夹的名称,这里要提醒大家一下,如果你之前电脑翻过墙、或者安装过翻墙工具、或者修改过hosts,可能会导致安装失败,解决方法就是关掉翻墙工具,恢复默认hosts文件,在我使用的过程中windows容易出现此问题,mac暂时还没发现

新建项目

根据提示打开 vue-test,安装所需要的依赖,执行npm install很快安装完;

安装依赖文件

安装完依赖后,可以在你项目所在的目录看到这些东西

项目目录结构

现在我们的项目就安装完成了,代表着你可以体验Vue了,在命令行项目所在的根目录yourname下执行npm run dev,项目会自动启动;

看到这个就代表你成功了

然后你的默认浏览器会自动打开一个页面;

漂亮的Vue,哈哈

到现在为止,一个基于Vue-cli的基本单页面项目就搭建成功了,我是纯纯的自学,可能有些地方描述的不对,欢迎大家吐槽!大家共同学习,哈哈!

上一篇下一篇

猜你喜欢

热点阅读