框架对比学习（1）：vue2.3，react和uniapp的创建项目和运行

@TOC

---

👍 点赞，你的认可是我创作的动力！

⭐️ 收藏，你的青睐是我努力的方向！

✏️ 评论，你的意见是我进步的财富！

---

前言

在这个系列文章中，我将介绍vue2.3，react和uniapp这些不同框架的知识点，进行对比学习。这是一个自己的知识的总结，一个小小的尝试，写的可能很菜很小白，勿喷求放过。

vue2，vue3创建项目

1.前提条件node.js(VUE2的版本需要再16以下)，安装vue-cli（npm i @vue/cli -g）

新建文件夹，cmd进入控制台 2.vue create 项目名称

3.创建vue3

4.创建vue2

5.vue2和vue3的启动项目的方式都是进入到项目内部之后使用npm run serve

uniapp创建项目

1.前提需要有HBuilder X开发工具

登录后复制

2.打开工具之后，点击左上角文件-新建-项目，可以选择vue2或者vue3版本（所以记得安装vue和node.js）![在这里插入图片描述](https://img-blog.csdnimg.cn/direct/116ef81afa424394a3324b3e6ef829d4.png)

• 1.

3.启动项目是在编辑器的上方的运行，选中到游览器运行（可以选择其他多种运行方式，不过需要进行配置）

react创建项目

1.前提需要有 node.js和create-react-app环境（npm install -g create-react-app）2.输入create-react-app 项目名称进行创建，创建如图过程，如果说这个有如图的错误这个事node.js的版本兼容问题，使用nvm调整一下版本就好

3.启动项目和vue有点不同是使用npm start

介绍

国内一般常用的使vue框架，react框架国外用的比较多，uniapp框架主要是用来多端开发的，主要还是用来开发小程序的。vue2目前是停止维护了但是还是有很多之前的项目用的是vue2的技术所以vue2还是有市场的。

Vue

简介

Vue.js 是一个用于构建用户界面的渐进式 JavaScript 框架，专注于视图层。它采用双向数据绑定和组件化开发，易于上手，提供了丰富的官方工具链，如 Vue Router 和 Vuex。

特点

1. 双向数据绑定：简化表单和用户输入处理。
2. 渐进式框架：易于集成到已有项目中，逐步引入复杂特性。
3. 组件化开发：提高代码复用性和可维护性。
4. 模板语法：使用类似 HTML 的模板语法，使开发更加直观。

React

简介

React 是一个用于构建用户界面的 JavaScript 库，专注于视图层。由 Facebook 开发和维护，React 使用单向数据流和组件化开发，通过 JSX 语法将 JavaScript 与 HTML 结合。

特点

1. 单向数据流：数据从父组件传递到子组件，通过回调函数更新状态。
2. 组件化开发：高度可复用的组件，提高开发效率。
3. JSX：将 JavaScript 与 HTML 结合，增强代码的灵活性和可读性。
4. 生态系统：丰富的第三方库和工具，如 Redux 和 Next.js，适合复杂项目开发。

Uniapp

简介

Uniapp 是一个基于 Vue.js 的多端开发框架，允许开发者使用 Vue 语法构建 H5、小程序、App 等多种平台的应用。由 DCloud 开发，Uniapp 提供了一套代码跨平台运行的能力。

特点

1. 跨平台支持：一套代码可以运行在 H5、小程序和 App 等多平台。
2. 基于 Vue 语法：开发体验与 Vue 一致，易于上手。
3. 丰富的插件和组件：内置了大量的官方插件和组件，方便快速开发。
4. 强大的生态系统：集成了很多第三方服务和插件，增强了开发能力。

对比

Vue vs React

1. 开发理念：

• Vue：渐进式框架，易上手，适合中小型项目。
• React：视图层库，需要结合其他库使用，适合大型复杂项目。

2. 数据绑定：

• Vue：双向数据绑定，更适合处理表单和用户输入。
• React：单向数据流，更适合管理复杂状态。

3. 模板语法：

• Vue：使用模板语法，直观且接近 HTML。
• React：使用 JSX，增强了灵活性和可编程性。

Vue vs Uniapp

1. 目标平台：

• Vue：主要用于 Web 应用开发。
• Uniapp：构建 H5、小程序、App 等多端应用。

2. 跨平台支持：

• Vue：需借助其他工具实现跨平台开发。
• Uniapp：内置跨平台支持，一套代码多平台运行。

3. 开发体验：

• Vue：专注 Web 开发。
• Uniapp：基于 Vue 语法，适合多平台开发。

React vs Uniapp

1. 开发理念：

• React：视图层库，需要结合其他库管理状态和路由。
• Uniapp：多端框架，内置跨平台支持。

2. 跨平台支持：

• React：主要用于 Web 开发，需结合 React Native 实现跨平台移动应用。
• Uniapp：内置多平台支持，适合开发 H5、小程序、App 等应用。

3. 生态系统：

• React：丰富的第三方库和工具，适合复杂项目。
• Uniapp：丰富的官方插件和第三方服务，适合快速多平台开发。

原创作者: u_14972985 转载于: https://blog.51cto.com/u_14972985/11315791