vue-cli(vue.js脚手架)安装成功记录

本文详述了Vue CLI的安装过程,包括node.js、cnpm、webpack的安装,接着通过在线和离线两种方式演示了vue-cli的安装及前端项目的创建。遇到的常见错误如ECONNREF和404响应码的解决方法也一并给出,最后讲解了如何卸载和升级相关组件。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

Step:

1,安装node.js

2,安装cnpm

3,安装webpack

4,安装vue-cli

5,安装前端项目

6,运行成功

7,如何卸载

8,其他

 

一,安装node.js

1,打开https://nodejs.org/en/官网下载node.js

2,安装Node.js,打开下载的文件一直下一步安装成功

3,确认安装成功,执行命令:node -v

 

二,安装cnpm

1,安装完node.js后,npm命令即可以使用了,可执行命令:npm -v 查看版本

2,在这里我们使用国内镜像,提高下载速度,所以安装cnpm,后面需要用到npm命令的,不要交替使用,一律改用cnpm

执行命令: npm install -g cnpm --registry=https://registry.npm.taobao.org 安装cnpm( -g 代表global全局得意思),安装成功后输入 cnpm -v 查看

 

三,安装webpack

1,执行命令: cnpm install webpack -g

`vue-cli-service.js` 是由 Vue CLI 创建的一个脚本文件,它是 Vue CLI 构建工具的核心部分。Vue CLI 是一个用于构建 Vue.js 应用程序的脚手架工具集,帮助开发者快速创建新项目,同时提供了一系列自动化任务,如打包、测试、服务器部署等。 在 `vue-cli-service.js` 文件中,你会看到一系列与 Vue CLI 功能相关的函数和模块导入,这些功能包括但不限于: - 启动开发服务器 (`serve`): 这个功能允许你启动一个热加载的开发服务器,以便在编辑代码时自动刷新浏览器视图。 - 构建生产环境应用程序 (`build`): 此功能负责将源代码打包成适用于生产环境的静态资源,优化性能并移除开发时的调试代码。 - 执行测试 (`test`): 提供了一套自动化测试框架,如 Jest 或 Mocha,帮助开发者编写和运行单元测试。 - 发布网站 (`gh-pages`): 将项目部署到 GitHub Pages 上,方便分享给他人预览或使用。 - 更新项目版本 (`update`): 自动检测和应用新版本的 VueVue CLI 的补丁更新。 - 开发模式 (`dev-server`) 和生产模式 (`prod-server`) 的支持: 分别针对开发和生产的环境提供定制化的服务。 `vue-cli-service.js` 是一个可执行脚本,可以通过在终端中输入命令 `.\\vue-cli-service.cmd` 来执行 Vue CLI 的各项任务。这使得用户能够通过简单的命令行指令来控制项目的构建流程,无需深入了解底层的脚本结构和复杂配置。 总之,`vue-cli-service.js` 是 Vue CLI 工具箱的灵魂所在,它整合了多种功能来简化前端 Web 开发过程,让开发者能够专注于构建高质量的 Vue.js 应用程序而无需过多关注基础基础设施的细节。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

johnfht

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值