【Vue】npm安装配置与vue初始化（Windows）

时间：2021-07-22 16:51:04 阅读：12 评论：0 收藏：0 [点我收藏+]

?Node.js

Node.js 是能够在服务器端运行 JavaScript 的开放源代码、跨平台运行环境。

Node.js 由 OpenJS Foundation（原为 Node.js Foundation，已与 JS Foundation 合并）持有和维护，亦为 Linux 基金会的项目。

Node.js 采用 Google 开发的 V8 运行代码，使用事件驱动、非阻塞和异步输入输出模型等技术来提高性能，可优化应用程序的传输量和规模。这些技术通常用于资料密集的即时应用程序。

Node.js 大部分基本模块都用 JavaScript 语言编写。在 Node.js 出现之前，JavaScript 通常作为客户端程序设计语言使用，以JavaScript 写出的程序常在用户的浏览器上运行。Node.js 的出现使 JavaScript 也能用于服务端编程。Node.js 含有一系列内置模块，使得程序可以脱离 Apache HTTP Server 或 IIS，作为独立服务器运行。

官方网站：Node.js (nodejs.org)

中文官网：Node.js 中文网 (nodejs.cn)

?npm

npm（全称 Node Package Manager，即“node包管理器”）是Node.js默认的、用JavaScript编写的软件包管理系统。

官方网站：npm (npmjs.com)

官方文档：npm Docs (npmjs.com)

中文文档：npm 中文文档 | npm 中文网 (npmjs.cn)

?npm安装配置

下载

进入Node.js官网 Node.js (nodejs.org) 点击下载 Node.js (LTS)

LTS(Long Term Support) -> 长期支持版本

技术分享图片

安装

运行下载得到的 node-v14.17.3-x64.msi

技术分享图片

安装完成

查看是否安装成功

技术分享图片

配置

配置global仓库

进入nodejs安装目录

新建文件夹 node_global、node_cache

配置global仓库与缓存路径

npm config set prefix "D:\nodejs\node_global"
npm config set cache "D:\nodejs\node_cache"

更改镜像源

npm config set registry=http://registry.npm.taobao.org

查看配置信息

技术分享图片

如图配置完成。

配置环境变量

新增 系统环境变量

NODE_PATH

内容：D:\nodejs\node_global\node_modules（配置的global仓库下的node_modules）

技术分享图片

修改 用户环境变量

技术分享图片

安装vue

npm install vue -g

-g 安装到global

！权限不足则使用管理器权限运行Terminal

技术分享图片

安装vue-router

中文官网：Vue Router (vuejs.org)

npm install vue -g

安装vue-cli

中文官网：Vue CLI (vuejs.org)

npm install vue-cli -g

技术分享图片

?vue初始化

vue init <template-name> <project-name>

例如：

vue init webpack vue-test

后续选项根据需求自行选择

cd进入项目目录后

# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

# build for production and view the bundle analyzer report
npm run build --report

依次运行