1. 安装git
其右键git bash here定位比cmd的命令行要准确,接下来的命令都是利用git bash here。
2. 安装node.js
一般利用vue创建项目是要搭配webpack项目构建工具的,而webpack在执行打包压缩的时候是依赖node.js的环境的,所以,要进行vue项目的开发,我们首先要安装node.js
建议不要安装在系统盘(如C:)
下载完毕,按照windows一般应用程序,一路next就可以安装成功。
3. 安装npm
4. 安装全局的vue-cli脚手架,用于帮助搭建所需的模板框架
npm install -g vue-cli,回车,等待安装
安装完后,可以输入vue,然后回车,如果出现vue的信息,则说明安装成功了。
5. 创建项目
自己找一个合适的地方,新建一个项目文件夹demo,根据自己的需要命名,
打开此文件夹,右键git bash here,
输入:vue init webpack test(项目文件夹名),回车,等待一小会儿,依次出现‘git’下的项,可按下图操作:
此时,观察demo的文件夹下又多了一个test文件夹,这个test文件夹就是vue项目的文件夹,如图所示:
6. 在test文件夹下git bash here
npm install,回车,等待一小会儿,回到项目文件夹,会发现项目结构里,多了一个node_modules文件夹(该文件里的内容就是之前安装的依赖)。
7. 在命令行里继续输入 npm run dev来测试环境是否搭建成功,如果出现如下图说明成功了:

8. 在浏览器里输入localhost:8080就可以查看页面如下:

原文链接:http://www.cnblogs.com/jiajia123/p/6132265.html

windows下搭建vue+webpack的开发环境的更多相关文章

  1. windows环境下搭建vue+webpack的开发环境

    前段时间一直在断断续续的看vue的官方文档,后来就慢慢的学习搭建vue的开发环境,已经有将近两周了,每到最后一步的时候就会报错,搞的我好郁闷,搁置了好几天,今天又接着搞vue的开发环境,终于成功了.我 ...

  2. react-native —— 在Windows下搭建React Native Android开发环境

    在Windows下搭建React Native Android开发环境 前段时间在开发者头条收藏了 @天地之灵_邓鋆 分享的<在Windows下搭建React Native Android开发环 ...

  3. windows下搭建Apache+Mysql+PHP开发环境

    原文:windows下搭建Apache+Mysql+PHP开发环境 要求 必备知识 熟悉基本编程环境搭建. 运行环境 windows 7(64位); Apache2.2;MySQL Server 5. ...

  4. 一步一步在Windows下搭建React Native Android开发环境

    搭建JAVA开发环境 依据操作系统分为x86或x64位的.下载jdk1.8以上的版本号. 本机安装时的java版本号:jdk-8u45-windows-x64.exe 配置JAVA的环境变量 JAVA ...

  5. 手把手教你在Windows下搭建React Native Android开发环境

    最近看到React Native好像好厉害的样子,好奇心驱使之下体验了一下并将在Window下搭建React Natvie Android环境的步骤记录下来,并有需要的朋友参考.(我都是参考官方文档的 ...

  6. 【转】在Windows下搭建React Native Android开发环境

    http://www.jianshu.com/p/2fdc4655ddf8 安装JDK 从Java官网下载JDK并安装.请注意选择x86还是x64版本. 推荐将JDK的bin目录加入系统PATH环境变 ...

  7. Windows下搭建Eclipse+Android4.0开发环境

    官方搭建步骤: http://developer.android.com/index.html 搭建好开发环境之前须要下载以下几个文件包: 一.安装Java执行环境JRE(没这个Eclipse执行不起 ...

  8. windows下搭建nginx+php+laravel开发环境(转)

    1.前言 windows下大多我们都是下载使用集成环境,但是本地已经存在一个集成环境,但不适合项目的需求.因此准备再自己搭建一个环境. 2.准备 工具: 1) 下载 nginx1.14.0(版本根据自 ...

  9. windows环境下安装vue+webpack的开发环境

    本人最近在学习vue,在学习的过程中遇到对的问题和解决方法 1.我们首先要安装node.js.node.js的官方地址为:https://nodejs.org/en/download/,下载完毕,按照 ...

随机推荐

  1. mysql性能优化随笔

    mysql性能优化是一个很大的命题,这里只记录一下近期的一些小经验. 曾经以为看了点create table时加index的语法就觉得自己知道怎么做mysql优化了,后来又看了点介绍mysql索引底层 ...

  2. 生鲜超市项目错误及解决办法(安装mysqlclient)

    错误1:安装Mysqlclient D:\Mxshop>pip install mysqlclient- 1.4.4-cp27-cp27m-win32 报错: ERROR: Could not ...

  3. Java的十三个设计模式

    OOP三大基本特性 封装 封装,也就是把客观事物封装成抽象的类,并且类可以把自己的属性和方法只让可信的类操作,对不可信的进行信息隐藏. 继承 继承是指这样一种能力,它可以使用现有的类的所有功能,并在无 ...

  4. vijos2055 移动金币

    题目链接 思路 首先这是一个阶梯博弈. 我们将金币两两组合,如果对方移动前一个,那么我们把后一个移动相同的距离,局面相当于没有变化.如果对方移动后一个,就相当于\(NIM\)游戏中,取走了一些石子. ...

  5. win10安装docker并结合Idea2018.1部署springboot项目

    一.准备工作 1..工具:win10,idea2018,maven3.5,jdk8 二.win10安装docker 1.win10安装docker:http://www.runoob.com/dock ...

  6. 【沙龙报名中】集结腾讯技术专家,共探AI技术原理与实践

    | 导语 9月7日,上海市长宁区Hello coffee,云+社区邀您参加<AI技术原理与实践>沙龙活动,聚焦人工智能技术在各产业领域的应用落地,共话AI技术带来的机遇与挑战,展望未来. ...

  7. jar解压后重新打包

    因为一些原因修改了jar中的配置文件,但用WinRAR压缩成zip文件后该后缀名为jar,发现重新压缩的文件不可用,所有这些情况下我们必须用jar重新打包. 配置Java环境,让jar命令可用: ja ...

  8. Beta冲刺(7/7)——2019.5.29

    作业描述 课程 软件工程1916|W(福州大学) 团队名称 修!咻咻! 作业要求 项目Alpha冲刺(团队) 团队目标 切实可行的计算机协会维修预约平台 开发工具 Eclipse 团队信息 队员学号 ...

  9. Jenkins打包编码GBK的不可映射字符

    1.错误信息如下: ​ 2.在Maven的POM中加入如下代码,然后重新打包即可. <properties> <!-- 文件拷贝时的编码 --> <project.bui ...

  10. Java8 新特性 Stream() 创建流

    通过Controllere类的Stream()和parallelStream()创建流 //通过集合创建流 @Test public void test1() { String arr[] = new ...