Vue环境搭建

安装npm

先了解一下npm是什么?(了解的大佬直接略过)

npm,全称【node package management】,是nodejs内置的软件包管理器。毫无疑问,npm是用来管理软件包的。

npm由三大独立部分组成:

网站:开发者查找包(package)、设置参数以及管理 npm 使用体验的主要途径,网址为:https://www.npmjs.com/

注册表:是一个巨大的数据库,保存了每个包的基本信息。

命令行工具:开发者与npm包打交道的工具。

下载一个node(http://nodejs.cn/)

搞搞前端--Vue学习

下载完后根据个人需求进行Next安装

搞搞前端--Vue学习

完成后在cmd中输入以下两行代码来看是否安装成功

搞搞前端--Vue学习

完成以上操作后配置环境变量

在以上的步骤已经完成了node.js的安装,即使不进行此步骤的环境变量配置也不影响node.js的使用,但是如果不进行环境变量配置,那么在我们使用命令安装node.js全局模块,例如npm install -g express时,会默认安装到C盘的路径C:\Users\hua\AppData\Roaming\npm中,所以在这边配置全局安装模块以及缓存目录的环境变量;

1.首先在node.js的安装目录新建两个文件夹node_global和node_cache

搞搞前端--Vue学习

2.创建完两个文件夹后,在cmd窗口中输入以下命令(两个路径即是两个文件夹的路径)

npm config set prefix “E:\node\node_global”
npm config set cache “E:\node\node_cache”

3.接下来设置电脑环境变量,右键“我的电脑”=》属性=》高级系统设置=》环境变量 进入以下环境变量对话框

系统变量中新建
变量名:NODE_PATH
变量值:E:\node\node_global\node_modules
搞搞前端--Vue学习
修改用户变量中path并且将值改为:
E:\node\node_global
搞搞前端--Vue学习

完成以上步骤后测试配置是否成功

在cmd中执行:npm install -g express

Npm处理完成后开始下载镜像,在此处网上有很多解决方案

由于国内使用npm 的官方镜像非常慢,推荐使用淘宝 NPM 镜像。
$ npm install -g cnpm --registry=https://registry.npm.taobao.org

执行完成后进入到下一步

项目初始化

安装vue-cli,如果没有安装淘宝的朋友使用后面的

cnpm install vue-cli -g/npm install vue-cli -g

完成以上操作后执行,弹出以下消息则说明安装成功了!

vue list
搞搞前端--Vue学习

接下来就是新建项目了,首先执行到你想要创建项目的路径下

1.E:/-> cd xxx

2.vue init webpack ”项目名称“

都完成了执行依赖

cnpm install / npm install
cnpm run dev / npm run dev

OK完成以上操作并且没有报Error,基本上代表您已经安装成功了,开始您的进阶之路吧!Keep going大家一起学习成长,欢迎来滴滴。

相关文章:

  • 2021-12-23
  • 2022-12-23
  • 2021-07-21
  • 2022-12-23
  • 2021-11-30
  • 2021-04-07
  • 2021-11-17
  • 2021-12-30
猜你喜欢
  • 2021-07-07
  • 2021-05-04
  • 2022-01-31
  • 2022-12-23
  • 2021-08-03
  • 2022-02-12
相关资源
相似解决方案