欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

node.js环境搭建及Vue CLI脚手架安装使用

程序员文章站 2024-03-22 18:12:16
...

1. 官网下载node.js 安装

传送门:node.js官网

下载后可以直接可以安装。node.js的node.msi安装包中包含有node.js和npm。
安装步骤:
node.js环境搭建及Vue CLI脚手架安装使用2. 点击change选择自己的安装目录,我的安装在d:\nodejs
node.js环境搭建及Vue CLI脚手架安装使用3.下面一路next就可以,不用点其他,直到安装完成。
4.检测node.js是否安装好。打开windows的命令行输入:node -v 和npm -v。
显示出版本则安装成功。注意有时会出现node 不存在该命令,则重启电脑。
node.js环境搭建及Vue CLI脚手架安装使用5.测试node.js 写第一行代码
输入命令:node 进入node界面,输入console.log(“hello world”);打印出结果。
node.js环境搭建及Vue CLI脚手架安装使用

2 配置node.js

  1. 配置npm的镜像为淘宝镜像

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

node.js环境搭建及Vue CLI脚手架安装使用执行这个命名会在 .npmrc文件中配置镜像。下面的registry就是配置的淘宝镜像
node.js环境搭建及Vue CLI脚手架安装使用node.js环境搭建及Vue CLI脚手架安装使用
2. 配置环境变量
新版本都不需要设计环境变量了,软件会自动写入环境变量。
传送门:老版本需要配置环境变量

3.安装vue CLI

1.查看Vue CLI 官网
传送门:Vue CLI官网地址
cmd命令行中输入命令:npm install -g @vue/cli
安装完成后,输入命令:vue -v
node.js环境搭建及Vue CLI脚手架安装使用2.如果出现:
vue : 无法加载文件 C:\Users\admin\AppData\Roaming\npm\vue.ps1,因为在此系统上禁止运行脚本。
则需要管理员身份运行命令行。右键点击开始菜单,点击windows powershell 管理员。

输入命令:set-ExecutionPolicy RemoteSigned
输入:y或者A 就可以了。
node.js环境搭建及Vue CLI脚手架安装使用3. Vue CLI安装完成后:
输入命令: vue ui
就可可以启动vue CLI 进行创建项目。
node.js环境搭建及Vue CLI脚手架安装使用上面的界面,需要现在浏览器中添加vue插件。我以火狐为例
1)、打开附加组件
node.js环境搭建及Vue CLI脚手架安装使用2)、搜素vue 找到vue devtools工具。点击进行安装即可。
node.js环境搭建及Vue CLI脚手架安装使用4. 使用Vue CLI 创建项目时,想要将创建在指定的文件下需要在命令行中切换到该目录下。
node.js环境搭建及Vue CLI脚手架安装使用
切换后目录后
node.js环境搭建及Vue CLI脚手架安装使用
创建项目:
node.js环境搭建及Vue CLI脚手架安装使用创建好的项目:
node.js环境搭建及Vue CLI脚手架安装使用参考博客