百度360必应搜狗淘宝本站头条
python判断字典是否为空crontab每周一执行aes和des区别安装指定版本npmadb pull
当前位置：网站首页 > IT知识 > 正文

Vue.js 环境配置（vue.js部署）

liuian 2025-06-18 22:20 28 浏览

说明：node.js 和 vue.js的关系：

Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行时环境；类比：Java的jvm(虚拟机)

vue.js 是渐进式JavaScript 框架（引用大神的话：“它给你提供足够的optional，但并不主张很多required，也不多做职责之外的事！这就是渐进式。”）；类比 ssm

所以先安装Node---------->使用Node的npm先安装Vue---------->安装vue-cli脚手架---------->最后通过vue-cli脚手架构建前端项目。

回到顶部

一、node.js 环境 （Windows）

步骤一：下载node.js ，按步骤安装；

步骤二、测试：

在键盘按下【win+R】键，输入cmd，然后回车，打开cmd窗口：

输入：

node -v

查看node 版本号；若显示则表示安装成果；

输入：

npm -v

查看npm(包管理器) 版本号；若显示则表示安装成果；

如图：

步骤三、环境配置：

①在E:\nodejs（安装nodejs的位置）中创建两个文件夹：【node_global】及【node_cache】；

②在控制台中输入 指令来配置 全局module安装位置和缓存位置；

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

③在【系统变量】下新建【NODE_PATH】，输入【E:\nodejs\node_global\node_modules】，将【用户变量】下的【Path】修改为【E:\nodejs\node_global】


④测试环境

输入：

npm install express -g     # -g是全局安装的意思

⑤、设置淘宝镜像：

控制台输入：

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

回到顶部

二、vue.js环境

参考

1.控制台输入：

npm install vue

2.vue_cli

npm install -g @vue/cli

回到顶部

三、创建vue.js项目(官网方式)；

最新方式创建：

在E:\vuecli中创建hello-vue项目（默认方式）：

vue create hello-vue

启动项目：npm run serve，控制台文件打开到hello-vue。

页面显示：

用旧版本的 vue init 功能创建项目

旧版本的 vue init 需要额外执行一条 npm install -g @vue/cli-init

npm install -g @vue/cli-init
# `vue init` 的运行效果将会跟 `vue-cli@2.x` 相同
vue init webpack my-project

文件目录为：

运行指令npm run dev;

结果：同 最新方式创建。

相关推荐

电脑内存条通用吗（电脑内存条通用吗怎样区分）

不是通用的。内存条是CPU可通过总线寻址，并进行读写操作的电脑部件。电脑上的内存条是不通用的，选择内存条的时候，需要查清主板支持的内存条的种类，在电脑上安装主板支持的内存条。内存条分为DDRDDR2...

系统维护中怎么解决（系统维护中一般要多久才能恢复）

系统正在维护中意思是系统正在更新或者升级中。网站或软件代码程序出现了问题，或者网站、软件需要更新升级的时候，一般会关闭进行查找问题，处理问题，内容进行更新。处理完了才会开通网站访问。为了清除系统运行中...

电脑桌面隐藏的文件夹怎么找出来

要查看电脑上隐藏的文件夹，可以采取以下几种方法：方法一：使用文件夹选项按下键盘上的Windows键和E键打开“文件资源管理器”。找到“查看”和“选项”两个选项并勾选。选中“显示隐藏的文件、文件夹和驱动...

搜狗中文手写输入法下载（下载搜狗手写版）

点击输入框弹出搜狗键盘，进入搜狗工具栏的设置图标，手写设置，勾选“手写注音”。在输入法点击那个键盘，就会有那个输入方式的选项，选择手写输入就可以了。呼出输入法，点击输入法上方的键盘图样，找到手写输入，...

免费云服务器怎么样（云服务器哪些是免费）

搞软件开发的人都知道，对于一些网络应用软件必须要租用服务器存放才能被更多用户使用。如一些应用于浏览软件、传输软件、远程登录软件等。如果是像以往那样租用物理机服务器，成本费用非常高昂。但是现在有云服务器...

斐讯路由器登录密码忘记了怎么办

1.斐讯无线路由器密码忘记，要重设密码，首先长按路由器背面的reset键，将路由器恢复出厂设置。2.路由器恢复出厂设置以后，在电脑浏览器地址栏中输入：192.168.1.1并按下回车键，“用户名”输...

软件之家软件分享（软件之家软件合集）

驱动精灵，驱动人生，360驱动大师。云之家挺好用的，通讯录是按组织架构的，跟微信一样可以看到所有人的动态，还有小组一般是按公司、部门、行业、兴趣分的，老板开讲可以把最上级的意思快速传达给所有员工。我们...

pps网络电视直播软件下载（ppstv版官方下载）
  • pps网络电视直播软件下载（ppstv版官方下载）
  • pps网络电视直播软件下载（ppstv版官方下载）
  • pps网络电视直播软件下载（ppstv版官方下载）
  • pps网络电视直播软件下载（ppstv版官方下载）
鲁大师下载安装免费版（鲁大师app下载）

解决方法吧。第一种方法：一般情况下，我们安装的时候软件也需要一定的时间，我们可以多等待一会。第二种方法：安装到99%你直接关掉安装。然后自己到安装目录文件里找到启动程序，就可以用了。第三种方法：1、可...

ssd坏道检测与修复（ssd硬盘坏道检测）

1、固态硬盘（SSD硬盘）损坏分两方面，一方面是出现硬盘坏块，另一方面是出现物理损坏。2、固态硬盘如果出现坏块是不可修复的。SSD硬盘坏块不是所谓的逻辑坏块。SSD硬盘内部是晶体管，损坏后不能恢复，这...

win10专业工作版激活密钥（windows10 专业版激活密钥）

要获得Windows10专业版永久激活密钥，可以通过微软官方零售渠道或可靠的第三方卖家购买正版产品密钥。使用第三方卖家时，务必注意其信誉和真实性。激活后，密钥将与您的Microsoft帐户关...

键盘下载安装（维语输入法键盘下载安装）

以惠普星14，win10系统为例，具体的操作步骤入如下：1、开启电脑后，在电脑的浏览器中搜索“输入法”。2、在页面中挑选一款自己喜欢的输入法软件，并点击旁边的下载按钮。3、随后在弹出的对话框中选择下载...

office 2010怎么激活（office 2010如何激活）

　1.打开下载好的Office，点击左上角的“文件”，然后在下拉菜单上点击“帮助”，显示需要激活Office。?　　2.找到解压缩好的安装文件，打开里面的“激活破解”文件夹。?　　3.在文件夹中运行激...

笔记本xp系统忘记开机密码（笔记本xp开机密码忘了怎么办最简单的方法）

xp系统忘记开机密码解锁方法如下1、在需要破解开机密码的xp电脑上插入pe启动盘，启动电脑后不停按F12、F11、Esc等快捷键，在弹出的启动菜单选择框中选择识别到的usb启动项，比如General...

新风系统安装示意图（新风系统安装效果图）
  • 新风系统安装示意图（新风系统安装效果图）
  • 新风系统安装示意图（新风系统安装效果图）
  • 新风系统安装示意图（新风系统安装效果图）
  • 新风系统安装示意图（新风系统安装效果图）
一周热门
最近发表
标签列表