1. nodejs官网http://nodejs.cn/下载安装包,无特殊要求可本地傻瓜式安装,这里选择2017-5-2发布的 v6.10.3,也可选择阿里云镜像https://npm.taobao.org/mirrors/node/,2019/3/23更新:建议选择v10版本以上,官方最新Vue-Cli4将移除v9的支持
  2. cmd命令行:

    node -v //显示node版本 v8.1.2

    npm -v  //显示npm包管理器版本 5.0.3

  3. 由于有些npm有些资源被屏蔽或者是国外资源的原因,经常会导致用npm安装依赖包的时候失败,所有我还需要npm的国内镜像---cnpm
  4. Cmd命令行中输入npm install -g cnpm --registry=http://registry.npm.taobao.org

  5.  安装vue-cli脚手架构建工具

  6. 至此,我们需要的环境及工具已经准备好了。

    接下来,我们使用vue-cli来构建项目。

  7. 首先,我们先选择进入到e我们的工作目录为 E:\个人\VueJS。此目录需先建好,目前是空的,这个工作目录以后会添加各个项目目录。
  8. 在VueJs目录下,运行命令vue init webpack firstVue。其中,webpack是构建工具、模块打包器,也就是整个项目是基于webpack的。其中,firstVue是项目文件夹的名称,这个文件夹会自动生成在vuejs这个工作目录中。
  9. 安装过程中,需要我们输入项目名称,描述,作者,版本(独立版),使用ESLint规范等等,此时,我们看到工作目录下已经自动生成了目录firstVue,如下图。

  10. 主要用的包都在package.json中,如下图

  11. cd到我们的项目文件夹firstVue中,运行命令cnpm install 安装包,(注意:我们已经使用淘宝镜像cnpm)

  12. 安装完之后,我们发现项目文件夹下多了一个node_modules目录,里面就是项目依赖包资源

  13. 安装完依赖包之后,就可以运行整个项目了。 运行项目在项目目录中,运行命令 npm run dev ,会用热加载的方式运行我们的应用,热加载可以让我们在修改完代码后不用手动刷新浏览器就能实时看到修改后的效果。

  14. 如果启动过程中出现端口冲突问题,只需要将config目录下的index.js文件中dev端口由8080改为8088

在window下搭建Vue.Js开发环境的更多相关文章

  1. 在window下搭建Vue.Js开发环境(转)

    nodejs官网http://nodejs.cn/下载安装包,无特殊要求可本地傻瓜式安装,这里选择2017-5-2发布的 v6.10.3 cmd命令行: node -v //显示node版本 v6.1 ...

  2. window下搭建Vue.Js开发环境

    一.安装node.js.https://nodejs.org/en/download/ 最新包会自动安装npm 二.安装完node之后,npm包含的很多依赖包是部署在国外的,在天朝,大家都知道下载速度 ...

  3. Window环境下搭建Vue.js开发环境

    原文链接:http://blog.csdn.net/solo95/article/details/72084907 笔者最近在进行前端的学习,在点完了HTML5.CSS3.JavaScript等技能树 ...

  4. vscode下搭建vue.js开发环境(基于最新的@Vue/cli 4.2.2)

    2020-02-13. 网上的那些怎么安装vue环境的2.x就不要再看了,都过时了,现在去官网下载,按照他们的设置各种问题.接下来看下最新的安装方法. 前四步是一样的: 1.下载并安装vscode 2 ...

  5. 搭建Vue.js开发环境(window10)

    我在配置Vue.js环境的时候遇到了很多的问题,希望能把这些解决方法也介绍给大家,希望能帮到大家,共同学习. 如果要转发,请注明原作者和原产地,谢谢! 注释:下面任何命令都是在windows的命令行工 ...

  6. windows下vue.js开发环境搭建教程

    这篇文章主要为大家详细介绍了windows下vue.js开发环境搭建教程,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 最近,vue.js越来越火.在这样的大浪潮下,我也开始进入vue的学习行列中 ...

  7. vue.js开发环境搭建以及创建一个vue实例

    Vue.js 是一套构建用户界面的渐进式框架.Vue 只关注视图层, 采用自底向上增量开发的设计.Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件. 在使用 vue.js ...

  8. ES6 学习笔记 (2)-- Liunx环境安装Node.js 与 搭建 Node.js 开发环境

    笔记参考来源:廖雪峰老师的javascript全栈教程 一.安装Node.js 目前Node.js的最新版本是6.2.x.首先,从Node.js官网下载对应平台的安装程序. 1.下载 选择对应的Liu ...

  9. Mac安装vue.js开发环境

    Mac安装vue.js开发环境 DannyHooDanny的专栏订阅 一.vue.js开发环境 二.初始化一个vue.js项目 三.vue.js项目打包部署 本来以为在Mac上搭建vue.js的环境挺 ...

随机推荐

  1. [No0000177]详解/etc/profile、/etc/bash.bahsrc、~/.profile、~/.bashrc的用途

    之前安装Linux的一些软件时,总要修改Linux的配置文件.当时也是一知半解.而且,网上有些安装教程,会说,修改配置文件后要重启Linux.但事实上是不需要重启的. Linux安装时可能要修改的配置 ...

  2. GPU安装小结

    今天一起安装了4块1080的卡.也算有一些坑吧,记录一下. 1)1080显卡,驱动型号,tensorflow,cuda, cudnn 版本一定要一致.我的清单如下: ################# ...

  3. 基于Docker搭建MySQL主从复制

    摘要: 本篇博文相对简单,因为是初次使用Docker,MySQL的主从复制之前也在Centos环境下搭建过,但是也忘的也差不多了,因此本次尝试在Docker中搭建. 本篇博文相对简单,因为是初次使用D ...

  4. wpf中的数据模板

    wpf中的模板分为数据模板和控件模板,我们可以通过我们自己定制的数据模板来制定自己想要的数据表现形式.例如:时间的显示可以通过图片,也可以通过简单数字表现出来. 例如: (1)先在Demo这个命名空间 ...

  5. goreplay,tcpcopy

    流量拷贝工具试用 https://github.com/buger/goreplaynginx mirror openresty 通过lua tcpcopy 支持 HTTP 请求的录制和重放,可以在线 ...

  6. 查找->动态查找表->键树(无代码)

    文字描述 键树定义 键树又叫数字查找树,它是一棵度大于或等于2的树,树中的每个结点中不是包含一个或几个关键字,而是只含有组成关键字的符号.例如,若关键字是数值,则结点中只包含一个数位:若关键字是单词, ...

  7. scala-高阶函数

    //1类似于lambda表达式的函数直接量====================== var get = (name: String) => { println(123 + name) } g ...

  8. 【PyQt5-Qt Designer】猜数字(小项目)

    参考:https://zhuanlan.zhihu.com/p/28287825 https://www.cnblogs.com/hhh5460/p/5174266.html 最终效果: 本次练习涉及 ...

  9. JavaScript学习(一)

    变量本身是没有类型的,类型在于它的值(注意开头都是小写).

  10. 【托业】托业(TOEIC)成绩 & 等级划分以及评分标准

    托业(TOEIC)成绩 & 等级划分以及评分标准 TOEIC全称:Test of English for International Communication(国际交流英语测评) 已通行全球 ...