windows环境下vue开发环境搭建

vue环境搭建

浏览器 chorme

IDE:VS code 或者 WebStorm

Node.js 8.9+ ,npm

先下载 node.js 然后安装

https://nodejs.org/en/

下载了 windows版64位 node.js 安装

cmd 进入 dos 输入 node -v 检查 node 安装上没有

这样就已经是安装成功了，由于在国内使用npm是非常慢的，所以在这里我们推荐使用淘宝npm镜像，使用

https://registry.npm.taobao.org；

1、在nodejs安装路径下，新建node_global和node_cache两个文件夹

设置缓存文件夹

npm config set cache "C:\Program Files\nodejs\node_cache"

设置全局模块存放路径

npm config set prefix "C:\Program Files\nodejs\node_global"

基于 Node.js 安装cnpm（淘宝镜像）

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

完成之后

通过命令配置

npm config set registry https://registry.npm.taobao.org

验证命令如果返回https://registry.npm.taobao.org，说明镜像配置成功。

npm config get registry

npm info express

设置系统环境变量 PATH

以上两个红框信息都不能少

再新建系统环境变量 NODE_PATH

检查 cnpm是否已经安装好命令 cnpm -v

执行安装命令

cnpm install vue -g

安装vue命令行工具，即vue-cli 脚手架

cnpm install vue-cli -g

创建一个vue的工作空间如 E:\vueSpace

cmd 进入该目录后建一个测试vue工程 mytest 命令如下

vue init webpack-simple mytest

一路回车至完成

查看目录

3、安装工程依赖模块

定位到mytest的工程目录下，安装该工程依赖的模块，这些模块将被安装在：mytest\node_module目录下，node_module文件夹会被新建，而且根据package.json的配置下载该项目的modules

cd mytest

cnpm install

此时目录如下

4、运行该项目，测试一下该项目是否能够正常工作，这种方式是用nodejs来启动。

cnpm run dev

此时浏览器弹出页面

此时vue 开发环境搭建完成

开发工具vscode 去官网下载

https://code.visualstudio.com/下载完成后安装

windows环境下vue开发环境搭建相关推荐

Windows 7 下 QT5 开发环境搭建
Windows7 下 QT 开发环境常见搭配方法有两种. 第一种是:QT Creator+QT SDK: 第二种是:VS+qt-vs-addin+QT SDK: 以上两种均可,所需文件见 QT 社区, ...
Linux环境下Android开发环境的搭建
本文主要介绍在Ubuntu下Android开发环境的搭建,所使用的IDE为Eclipse(Android Studio同理,且可省去配置SDK以及安装adt插件的步骤). 1.安装JDK (1)JDK ...
Windows 10下Linux开发环境搭建
摘要:本文说明在Windows10环境下搭建Linux开发环境的步骤.无需安装特定的虚拟机环境,只需要在Windows环境下通过应用商店安装基于WSL的Ubuntu系统即可.并且通过VSCode安装W ...
windows 环境下node开发环境搭配问题
当我们使用ccap 生成验证码时,需要node-gyp构建build,但是c的编译环境是在python,vc. node-gyp包 https://github.com/TooTallNate/nod ...
Java windows系统下JDK开发环境配置和环境变量配置
一.JDK下载地址 http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html 二.Ecli ...
【开发环境】Windows环境下Python开发环境 Pycharm Anaconda安装配置（无错完整）
目录一.Python解释器: 1.官网下载解释器: 2.安装Python 解释器: 手动配置环境变量: 二.Pycharm 集成开发环境: 1.Pycharm官网下载: 2.Pycharm本地安装: ...
Windows系统下Java开发环境搭建
卸载JDK 1.删除Java的安装目录(通过右键点击我的电脑->属性->高级系统设置->环境变量->系统变量中的JAVA_HOME找到Java的安装目录) 2.删除JAVA_H ...
windows 7 下 .net 开发环境的搭建
第一步,安装IIS和.net Framework 进入"控制面板\程序\程序和功能" 点击"打开或者关闭windows功能" 勾选"Microsot ...
Windows10环境下Python 开发环境搭建
目录前言: 一.安装包二.Python安装三.Pycharm安装四.pip使用前言: 本文档使用的安装包版本: python3.9.6 pycharm-community-2021.1.3 ...
cc java开发环境搭建_Windows系统下java开发环境搭建
总的来说,开发环境是程序员工作的基础,没了他,IT工作就没得开展了.话不多说,今天提供的教程是Windows系统下Java开发环境的搭建,具体如下 1.下载并安装JDK(JAVA Developmen ...

windows环境下vue开发环境搭建

windows环境下vue开发环境搭建相关推荐

最新文章

热门文章