环境兼容： Vue3+ELement-plus
题目：环境兼容： Vue3+ELement-plus
前言
身为小白的我也在负责一个项目咯，开发的是Vue3项目，然后就搜阅多篇文章，整理了这个。内容很多是转载的，拼成的我这个文章。
Element-plus简介
Element-plus 是基于 Vue 3 的 UI 组件库，它对 Node.js 的兼容性有一定的要求:
- Node.js 版本要求：确保已安装好 Node.js 版本为 v21.7 及以上。
- Vue CLI 版本：如果您使用 Vue CLI 作为构建工具，版本v4 与 v5 皆可。
- Webpack 版本：如果您使用 Webpack 4 或 Webpack 5 作为构建工具，Element Plus 也提供了相应的配置建议。
- Element Plus 对 npm 的版本并没有特别的要求。
- Element Plus 是一个基于 Vue 3 的 UI 组件库，主要用于前端开发。它与 Java 开发工具包（JDK）没有直接关系。
Element-plus的安装步骤
（1）第一步：确保已安装好node.js-v21.7及以上版本。
Node.js 是一个服务器端 JavaScript 运行环境，而 npm 是 Node.js 的配套包管理器，用于管理项目依赖和发布代码包，两者共同为 JavaScript 开发提供了一个完整的生态系统。
检查是否成功安装成功node以及npm，以及查询版本信息版本
1）操作
- 输入命令行node -v，成功安装则显示版本信息
- 输入命令行npm -v，成功安装则显示版本信息
2）若版本没有达到node.js-v21.7及以上版本，需要升级node版本
- window系统升级node只能到node官网下载window安装包来覆盖之前的node。
- node 安装教程附下载地址(转载)：https://blog.csdn.net/qq_45677671/article/details/114535955
3）若未安装(注意安装的版本)：
-
安装 Node.js 时，
npm也会随之安装 -
node简介及安装（转载）：https://blog.csdn.net/qq_45677671/article/details/114535955
（2）第二步：安装vue(可先不看)
Vue 本身是一个 JavaScript 库，通常不需要全局安装。Vue 通常是作为项目依赖被安装到特定的项目中。如果你需要检查项目中是否已经安装了 Vue，可以查看项目的 package.json 文件，看是否有 vue 作为依赖。
(3) 第三步：全局安装vue cli
vue-cli是vue的脚手架工具，帮我们快速生成了vue的起步项目，内置一些必备的比如打包工具，比如配置文件等等。
安装 Vue CLI 和全局安装 Vue CLI 的区别：
- 项目内安装：仅限于当前项目使用，版本由项目控制。
- 全局安装：可在任何项目中使用，版本全局统一。
检查是否全局安装vue cli
1）操作
【1】法一：命令行输入vue --version，成功则显示版本信息（图片转载）。
【2】法二：命令行输入vue后按下回车，显示以下信息则成功（图片转载）。
2）若版本太低
vue cli版本更新教程（转载）：https://blog.csdn.net/liaowei_49/article/details/128684238
3）vue cli 全局安装操作（转载）
a)、因为在国内npm安装会比较慢，所以这里推荐一下先安装淘宝镜像（官网：http://npm.taobao.org；）
b)、在控制台执行命令：npm install cnpm -g --registry=https://registry.npm.taobao.org
c)、安装完成就可以使用cnpm来代替之前的npm这样的安装效率会快很多（以下操作会由cnpm代替npm）
d)、操作完以上步骤可以在继续在命令行输入：cnpm install -g vue-cli。
e)、检查是否全局安装vue cli。
Webpack
Webpack就是一个能把vue、ts、sass等特性转换成html、css、js以便浏览器渲染，是一些工具的集合，把分散的内容打包成一个整体。loader 负责文件的转换和加载，而 plugin 负责扩展 Webpack 的功能和处理构建过程中的特定任务，三者相辅相成，共同构成了 Webpack 强大的模块打包和构建能力。
使用 Vue CLI 创建项目，就不需要自己手动安装 Webpack，因为 Vue CLI 已经包含了 Webpack 并配置好了，Vue CLI 提供了一个预配置的开发环境，包括热重载、代码分割、ESLint 等。
总结
加油呀，越努力越幸运哦。失败不可怕，可怕的是失败后一蹶不振。
原文地址：https://blog.csdn.net/2401_83624776/article/details/144233327
免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！