nodejs + vue环境搭建

安装nodejs
- 下载并安装[nodejs]
- 配置nodejs
- 安装cnpm(淘宝镜像)
安装vue
- vue
- vue-cil
测试，创建新项目
附上vue项目文件夹说明简介

安装nodejs

下载并安装[nodejs]

nodejs下载地址https://nodejs.org/en/download/
历史版本下载地址https://nodejs.org/en/download/releases/

配置nodejs

（由于新版本node已经弃用 --global, --local）
打开node安装目录，编辑npm.cmd，将prefix --g修改为prefix --location=global

在node的安装目录创建两个文件夹
node_cache(缓存文件夹)
node_global(全局模块存放文件夹)
设置node缓存文件夹npm config --location=global set cache "C:\Program Files\nodejs\node_cache"
设置node全局模块文件夹npm config --location=global set prefix "C:\Program Files\nodejs\node_global"

配置node全局模块环境变量（由于 node 全局模块大多数都是可以通过命令行访问的，所以把(node_global)的路径添加进环境变量）
cmd中输入sysdm.cpl打开系统属性

新增变量NODE_PATH

安装cnpm(淘宝镜像)

国内访问不通畅，可以更改cnmp(淘宝镜像，大约10分钟同步一次官方镜像。有办法解决访问问题的可以忽略这一步)
npm install --location=global cnpm --registry=https://registry.npm.taobao.org

至此node安装完成

安装vue

vue

npm install vue --location=global

如安装cnpm可使用cnpm安装cnpm install vue --location=global

vue-cil

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

npm install @vue/cli --location=global

如安装cnpm可使用cnpm安装cnpm install @vue/cli --location=global

安装完成

测试，创建新项目

在要创建项目的根文件夹下打开cmd;

CHCP 65001

(更改cmd当前编码为UTF8，解决cmd控制台乱码情况)

vue create demo

(demo即为项目名称)，然后回车

选择VUE项目使用的vue版本，这里以vue3为例，回车，等待完成

执行完毕后，会在当前目录下创建demo文件夹，这个文件夹中就是刚创建的项目
根据提示输入

cd demo
npm run serve

等待运行完毕

在浏览器输入地址:端口进行访问

至此NODEJS+VUE环境搭建完成

附上vue项目文件夹说明简介

内部文件夹说明

nodejs + vue环境搭建相关推荐

VUE环境搭建教程以及VSCODE插件Vetur和ESlint的安装配置
*此教程适用于Windows环境下 Author:Sinclair CreateDate:2018-10-09 1.安装node.js 下载地址:Download | Node.js (LTS代表 ...
Vue环境搭建(node安装,环境配置,运行项目)
Vue环境搭建(node安装,环境配置,运行项目) 一.安装node 1.去官网下载node之后,推荐安装稳定版本(LTS)node官网下载地址 2.查看node安装成功否 node -v 查看nod ...
NodeJS入门--环境搭建 IntelliJ IDEA
NodeJS入门–环境搭建 IntelliJ IDEA 本人也刚开始学习NodeJS,所以以此做个笔记,欢迎大家提出意见. 1.首先下载安装NodeJS,下载安装IntelliJ IDEA 2.接下 ...
nodeJS的环境搭建以及nodeJS和npm简介
nodeJS的环境搭建 1. Node.js是什么? 2. npm是什么? 3. Node.js环境搭建 3.1 下载 3.2 解压 3.3 配置环境变量 3.4 配置npm全局模块路径和cache默 ...
Django+Vue环境搭建
一.Django环境 1.下载Django pip install django 2.创建Django项目 django-admin startproject server #server 为项目 ...
Vue环境搭建及入门
初始Vue Vue环境搭建 Vue模板语法 Vue数据绑定 el-data的两种写法 MVVM模型 Vue数据代理 Vue中的事件处理 Vue官网:https://cn.vuejs.org 初始Vue ...
Vue 环境搭建和 Hello world
文章目录 vue环境搭建引入vue 安装vue开发者工具全局配置 Hello world 404报错处理 Hello world 一些分析总结尚硅谷Vue2.0+Vue3.0全套教程丨vuej ...
Spring Boot + Vue前后端分离（一）前端Vue环境搭建
你好,[程序职场]专注于:Spring Boot ,微服务和前端APP开发,闲暇之余一起聊聊职场规划,个人成长,还能带你一起探索副业赚钱渠道,在提升技术的同时我们一起交流敏捷流程提高工作效率 ...
【0523】vue环境搭建
目录前言一.安装node.js 1.环境准备 2.下载完成后解压即可 3.验证环境搭建成功二.搭建Vue脚手架 1.配置淘宝镜像 2.配置npm下载依赖的位置 3.验证node.js环境配置 4 ...

nodejs + vue环境搭建

nodejs + vue环境搭建

安装nodejs

下载并安装[nodejs]

配置nodejs

安装cnpm(淘宝镜像)

安装vue

vue

vue-cil

测试，创建新项目

附上vue项目文件夹说明简介

nodejs + vue环境搭建相关推荐

最新文章

热门文章