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. signal(SIGCHLD, SIG_IGN)和signal(SIGPIPE, SIG_IGN);

    signal(SIGCHLD, SIG_IGN); //忽略SIGCHLD信号,这常用于并发服务器的性能的一个技巧 //因为并发服务器常常fork很多子进程,子进程终结之后需要//服务器进程去wait ...

  2. contiki rpl

    Linking target: udp-client-temperature.stk3700arm-none-eabi-gcc -Xlinker -Map=udp-client-temperature ...

  3. socket数据收发

    socket读写 TCP协议是面向流的,read和write调用的返回值往往小于参数指定的字节数.对于read调用,如果接收缓冲区中有20字节,请求读100个字节,就会返回20.对于write调用,如 ...

  4. 百度地图Api进阶教程-基础地图示例1.html

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  5. Java-jdbc工具类DBUtils

    创建项目: 导入相应jar包: 看上图. JDBCUtil.java获取数据库连接文件: package com.gordon.jdbcutil; import java.io.InputStream ...

  6. Java 中的异常和处理详解

    Java 中的异常和处理详解 原文出处: 代码钢琴家 简介 程序运行时,发生的不被期望的事件,它阻止了程序按照程序员的预期正常执行,这就是异常.异常发生时,是任程序自生自灭,立刻退出终止,还是输出错误 ...

  7. js学习笔记13----数组的操作

    1.数组的定义 格式1:var arr=[1,2,3]; 格式2:var arr=new Array(1,2,3); //new可以省略 注意:var arr=new Array(4);如果你里面只写 ...

  8. 几个Tab,滑动门,选项卡,图片切换

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...

  9. IntelliJ IDEA 14 利用JRebel实现热部署

    特别鸣谢:http://wlb.wlb.blog.163.com/blog/static/467413201522095132658/ ©IntelliJ IDEA开源社①群 185441009 鸣谢 ...

  10. VS2013环境生成和调用DLL动态链接库

    http://blog.csdn.net/u010273652/article/details/25514577 创建动态库方法: 创建动态库是生成 .dll .lib 两个个文件 文件 -> ...