1 安装Node.js

参看 node.js环境安装
   http://www.cnblogs.com/richerdyoung/p/7265786.html

2 安装淘宝镜像

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

3 安装全局vue-cli脚手架,用于帮助搭建所需的模板框架

cnpm install -g vue-cli

输入:vue,回车,若出现vue信息说明表示成功

4 切换到你的项目目录

cd desktop/vue

5 新建vue项目

vue init webpack vuetest 

6 一路回车(第4步ESLint 可以一路n,大师请忽略n)
 

进入新建项目

cd vuetest 

cnpm install 

npm run dev

目录结构

  • main.js 是我们的入口文件,主要作用是初始化vue实例并使用需要的插件
  • App.vue是我们的主组件,所有页面都是在App.vue下进行切换的。其实你也可以理解为所有的路由也是App.vue的子组件。所以我将router标示为App.vue的子组件。
  • index.html文件入口
  • src放置组件和入口文件
  • node_modules为依赖的模块
  • config中配置了路径端口值等
  • build中配置了
  • webpack的基本配置、开发环境配置、生产环境配置等

【VUE】Mac下vue 开发环境搭建,以及目录结构的更多相关文章

  1. mac下java 开发环境搭建

    mac配置java开发环境: jdk1.7 +sdk1.7+maven +tomcat   1.先安装jdk ,才能安装sdk . 2 mac中jdk1.7的默认位置:/Library/Java/Ja ...

  2. mac下Android开发环境搭建

    之前一段时间在学习ios的开发,近一段时间想着也接触下Android开发,以来加深对移动端开发的理解.这里根据自己配置Android开发环境的过程,比较详细的来总结下自己的安装过程,希望对一些正准备配 ...

  3. Mac下JAVA开发环境搭建

    最近开始学习JAVA, 首先配置下环境! 1.Mac自带的jdk版本老了,需要到oracle官网去下载新的jdk,具体下载那个版本看个人需求,然后安装.   安装完成之后打开Terminal, 执行命 ...

  4. Mac下Cordova开发环境搭建

    xcode下载 从Mac App Store 下载Xcode,只需要在Store键入Xcode,下载第一个就ok了 cordova安装与配置 cordova需要node安装,使用Safari打开nod ...

  5. mac下php开发环境搭建+CI框架使用

    一.启动apache: apachectl start 停止: apachectl stop 配置文件: vi /etc/apache2/httpd.conf 一.修改端口 因为80端口不想被占用,8 ...

  6. Mac下R语言环境搭建

    Mac下R语言环境搭建 博主在数据分析的时候一直用的python(MATLAB太重了),最近跟其他搞学术的人合作,需要用一下R语言,所以也打算顺便学习一下R. R语言简介 R语言是用于统计分析,图形表 ...

  7. OpenCV学习系列(零) Mac下OpenCV + xcode环境搭建

    # OpenCV学习系列(零) Mac下OpenCV + xcode环境搭建 [-= 博客目录 =-] 1-学习目标 1.1-本章介绍 1.2-实践内容 1.3-相关说明 2-学习过程 2.1-hom ...

  8. Windows 7 下 PHP 开发环境搭建(手动)

    Windows 7 下 PHP 开发环境搭建 1.说明 做开发的都知道一句话,就是“站在巨人的肩膀上”.确实现在打开浏览器随便一搜很多一键安装PHP环境的软件,比如wamp.xampp.AppServ ...

  9. NDK在windows下的开发环境搭建及开发过程

    在Android应用的开发工程中,不管是游戏还是普通应用,都时常会用到.so即动态链接库,关于.so是什么玩意儿,有什么好处,这个大家可以在网上查一下,本人不做过多解释..so本是linux下的文件类 ...

  10. Android下NDK开发环境搭建

    Android下NDK开发环境搭建 1.     AndroidNDK安装与配置 1.1  NDK简介 Android NDK是一套允许开发人员使用本地代码(如C/C++)进行Android APP部 ...

随机推荐

  1. 【Android】使用Pull生成/解析XML文件

    一.生成XML文件,即是将对象集合转为XML文件存储. 对象集合 –> XML(序列化) Android中使用android.util.Xml类对其进行了描述,提供相应的API. 步骤大致如下: ...

  2. 【WPF/C#】拖拽Image图片控件

    需求:使得Image图片控件能够被拖动. 思路:关键是重写Image控件的几个鼠标事件,实现控制. 前台: <Image Source="C:\Users\Administrator\ ...

  3. [script]判定某一个脚本是否正确执行

    返回内容存在$?, 0代表成功,其他代表失败 some_command ]; then echo OK else echo FAIL fi 字符型的返回值 some_command retval=$? ...

  4. Android——ImageView的scaleType属性与adjustViewBounds属性 (转)一

    ImageView的scaleType的属性有好几种,分别是matrix(默认).center.centerCrop.centerInside.fitCenter.fitEnd.fitStart.fi ...

  5. c# dataTable 合并两个列到一个新列中

    public static DataTable UniteDataTableColumns(DataTable dt, String newColumnName, string ColumnName1 ...

  6. Entity Framework应用:Loading Entities

    Entity Framework允许控制对象之间的关系,在使用EF的过程中,很多时候我们会进行查询的操作,当我们进行查询的时候,哪些数据会被加载到内存中呢?所有的数据都需要吗?在一些场合可能有意义,例 ...

  7. DataGridView使用技巧十:单元格表示值的自定义

    通过CellFormatting事件,可以自定义单元格的表示值.(比如:值为Error的时候,单元格被设定为红色) 示例: private void dgv_Users_CellFormatting( ...

  8. C#基础教程/适合初学者

    C#基础教程 第一章       C#语言基础 本章介绍C#语言的基础知识,希望具有C语言的读者能够基本掌握C#语言,并以此为基础,能够进一步学习用C#语言编写window应用程序和Web应用程序.当 ...

  9. 5G的7位电话号码,去重,内存20mb,代码实现。

    转自:http://www.aboutyun.com/thread-11139-1-1.html 答案:首先,这个题考的不是分布式7位数,至少要用int来保存,那么int为4字节,20MB内存 10^ ...

  10. 转00600异常解决方案:ORA-00600: 内部错误代码, 参数: [19004], [], [], [], [], []

    <问题描述> ORACLE 10.1 OR 10.2中所有平台都存在该问题. <问题现象> 在进行多表关联复杂查询时出现 ORA-00600: 内部错误代码, 参数: [190 ...