Angular 和 Vue2.0 对比

前言 :“业精于勤,荒于嬉;行成于思,毁于随” 很久没写博客了,大多记录少进一步探查。

Angular 和 Vue2.0 对比:

一.概念

  • 1.1 Angular 框架:

是一款由谷歌开发的开源web前端框架(核心采用MVC模式),它基于TypeScript(同时支持JavaScript),常适用于中大型企业级项目;

  • 1.2 Vue2 框架:

‌是一个用于构建用户界面的渐进式JavaScript框架(核心采用MVVM模式),主要用于单页应用程序(SPA)开发。作者:由尤雨溪创建,于2016年发布。Vue 2的设计理念是让开发者可以更专注(简洁高效地构建)视图层;

二. 对比

2.1. 构建~项目

angular使用 angular cli 脚手架(例如:ng new project-name);
vue2使用 vue cli 脚手架脚手架(例如:vue create project-name);

2.2 项目 | 初始目录
2.2.1 Angular目录:

在这里插入图片描述

2.2.1 Vue2 目录:

在这里插入图片描述

针对上2点补充:

配置代理文件angular【proxy.conf.json】配置文件和vue 【vue.config.js】,是由手工去创建的,非默认生成文件,该类型的文件~主要作用就是配置开发环境中的代理服务器,解决跨域问题!(只能适用开发环境,生产环境使用使用ngxin代理或后端服务去解决)

2.3 图文概览

angular图
在这里插入图片描述

vue2 图
![在这里插入图片描述](https://i-blog.csdnimg.cn/direct/97abc3e7b53b46bf8ac72820d85c0584.png

最后补充:
  • angular执行npm安裝特别慢,容易报错( 2种方法:国内npm安裝慢,使用cnpm进行安裝依赖或设置代理使用淘宝镜像 )
  • angular中,创建组件,需要单独创建html、js、css文件和路由文件,可以看成angular的模块化、工程化一种形式,而ts的规范属性的类型声明、对象的声明这种严格模式,更好的遵从语义化标准,更好的代码的维护管理;
  • angular的项目体积大,一般运行时间长,反之vue项目体积小,启动速度快;
  • 项目入口文件,前者main.ts 后者man.js
  • 相比于angular组件的css、js、html分开写,vue可以在一个文件内可以同时写(单页面组件),前者文件分明、后者逻辑复杂代码冗长,臃肿
  • api提炼,angular中分为2部分:1 将其提炼到.model.ts里面变成一个类(声明类拥有的属性及对应的类型),2. 在server文件夹内定义具体接口方法;vue中对于接口,单纯定义封装具体业务的api.js,现比简洁;

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/914825.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

【Python】轻松实现机器翻译:Transformers库使用教程

轻松实现机器翻译:Transformers库使用教程 近年来,机器翻译技术飞速发展,从传统的基于规则的翻译到统计机器翻译,再到如今流行的神经网络翻译模型,尤其是基于Transformer架构的模型,翻译效果已经有了质的飞…

[2024最新] macOS 发起 Bilibili 直播(不使用 OBS)

文章目录 1、B站账号 主播认证2、开启直播3、直播设置添加素材、隐私设置指定窗口添加/删除 窗口 4、其它说明官方直播帮助中心直播工具教程 目前搜到的 macOS 直播教程都比较古早,大部分都使用 OBS,一番探索下来,发现目前已经不需要 OBS了&a…

前端 性能优化 (图片与样式篇)

文章目录 前端能够做哪些图片优化?1、减小图片体积2、图片缓存服务工作线程 (Service Workers)缓存IndexDB缓存图片LocalStorage缓存 3、图片懒加载使用 loading"lazy" 属性 4、不同分辨率下使用不同的图片5、使用webp格式的图片6、配置图片CDN7、减少图片和动图的使…

【MySQL 保姆级教学】事务的自动提交和手动提交(重点)--上(13)

目录 1. 什么是事务?2. 事务的版本支持3. 事务提交的方式3.1 事务提交方式的分类3.2 演示的准备的工作3.2.1 创建表3.2.2 MySQL的服务端和客户端3.2.3 调低事务的隔离级别 4. 手动提交4.1 手动提交的命令说明4.2 示例一4.3 示例二4.4 示例三4.5 示例四 5. 自动提交5…

C++ | Leetcode C++题解之第546题移除盒子

题目&#xff1a; 题解&#xff1a; class Solution { public:int dp[100][100][100];int removeBoxes(vector<int>& boxes) {memset(dp, 0, sizeof dp);return calculatePoints(boxes, 0, boxes.size() - 1, 0);}int calculatePoints(vector<int>& boxes…

RK3588部署ppocr流程及安装环境_笔记1

前言&#xff1a; RK3588部署ppocr流程及ubuntu安装环境 目录 一、NoMachine安装使用 二、把ubuntu系统从英文修改为中文界面 三、安装conda 没有报错说明没有问题&#xff0c;如果source的时候报错&#xff0c;查看 ​编辑 报这种错&#xff1a; 5、需要添加国内镜像源…

二分查找习题篇(下)

二分查找习题篇(下) 1.山脉数组的峰顶索引 题目描述&#xff1a; 给定一个长度为 n 的整数 山脉 数组 arr &#xff0c;其中的值递增到一个 峰值元素 然后递减。 返回峰值元素的下标。 你必须设计并实现时间复杂度为 O(log(n)) 的解决方案。 示例 1&#xff1a; 输入&#xf…

Linux学习笔记之shell快速入门及相关变量

Shell是什么 Shell是一个命令解释器&#xff0c;它为用户提供了一个向Linux内核发送请求以便运行程序的界面系统级程序&#xff0c;用户可以通过Shell来启动、挂起甚至编写一些程序。 Shell脚本执行方式 脚本格式要求 脚本以#!/bin/bash开头脚本需要有可执行权限 脚本的常…

el-table 行列文字悬浮超出屏幕宽度不换行的问题

修改前的效果 修改后的效果 ui框架 element-plus 在网上找了很多例子都没找到合适的 然后这个东西鼠标挪走就不显示 控制台也不好调试 看了一下El-table的源码 他这个悬浮文字用的el-prpper 包着的 所以直接改 .el-table .el-propper 设置为max-width:1000px 就可以了 吐槽一…

ApiSmart x Qwen2.5-Coder 开源旗舰编程模型媲美 GPT-4o, ApiSmart 实测!

通义千问代码模型开源版。Qwen2.5-Coder相比CodeQwen1.5有了实质性的改进。Qwen2.5-Coder在包含5.5万亿Token的编程相关数据上进行了训练&#xff0c;使即使较小的编程专用模型也能在编程评估基准测试中表现出媲美大型语言模型的竞争力。 阿里云-2024年11月12日 Qwen2.5-Coder …

Java项目实战II基于微信小程序的个人行政复议在线预约系统微信小程序(开发文档+数据库+源码)

目录 一、前言 二、技术介绍 三、系统实现 四、文档参考 五、核心代码 六、源码获取 全栈码农以及毕业设计实战开发&#xff0c;CSDN平台Java领域新星创作者&#xff0c;专注于大学生项目实战开发、讲解和毕业答疑辅导。获取源码联系方式请查看文末 一、前言 基于微信小…

MyBatis xml 文件中 SQL 语句的小于号未转义导致报错

问题现象 在 MyBatis 的 xml 文件中添加了一个 SQL 语句 <select id"countXxx" resultType"int">select count(*) from t1 where count < 3 </select>启动 Spring Boot 应用程序后报错&#xff1a; Caused by: org.apache.ibatis.builde…

C++20 STL CookBook 7 Containers(II)

让vector在插入删除的时候仍然保证是有序的 首先&#xff0c;STL的确提供了一种办法来检查我们的目标容器是不是有序的&#xff1a;std::is_sorted - cppreference.com&#xff0c;也就是std::is_sorted。我们当然可以这样做&#xff1a; #include <iostream> #include…

FlinkSql读取kafka数据流的方法(scala)

我的scala版本为2.12 <scala.binary.version>2.12</scala.binary.version> 我的Flink版本为1.13.6 <flink.version>1.13.6</flink.version> FlinkSql读取kafka数据流需要如下依赖&#xff1a; <dependency><groupId>org.apache.flink&…

语音 AI 革命:未来,消费者更可能倾向于与 AI 沟通,而非人工客服

「未来&#xff0c;消费者更可能倾向于与 AI 沟通&#xff0c;而非人工客服&#xff0c;因为这将成为解决问题的最高效途径。」 这篇来自 Bessemer Venture Partners 的报告&#xff0c;是目前为止对语音 AI 在企业应用上最完整清晰的一次梳理。 核心要点&#xff1a; 尽管市…

【t365】基于springboot的高校疫情防控系统

摘 要 互联网发展至今&#xff0c;无论是其理论还是技术都已经成熟&#xff0c;而且它广泛参与在社会中的方方面面。它让信息都可以通过网络传播&#xff0c;搭配信息管理工具可以很好地为人们提供服务。针对信息管理混乱&#xff0c;出错率高&#xff0c;信息安全性差&#x…

DAY27|贪心算法Part01|LeetCode:455.分发饼干、376. 摆动序列、53. 最大子序和

贪心算法 贪心的本质是选择每一阶段的局部最优&#xff0c;从而达到全局最优。 贪心算法并没有固定的套路&#xff0c;最难想的就在于如何通过局部最优去推出全局最优。在做一个题目的时候&#xff0c;靠自己手动模拟&#xff0c;如果模拟可行&#xff0c;就可以试一试贪心策略…

四万字长文SpringBoot、Spring、SpringMVC等相关面试题(注:该篇博客将会持续维护 最新维护时间:2024年11月12日)

&#x1f9f8;本篇博客重在讲解SpringBoot、Spring、SpringMVC等相关面试题&#xff0c;将会实时更新&#xff0c;欢迎大家添加作者文末联系方式交流 &#x1f4dc;JAVA面试题专栏&#xff1a;JAVA崭新面试题——2024版_dream_ready的博客-CSDN博客 &#x1f4dc;作者首页&…

免费HTML模板和CSS样式网站汇总

HTML模板&#xff1a;&#xff08;注意版权&#xff0c;部分不可商用&#xff09; 1、Tooplate&#xff0c;免费HTML模板下载 Download 60 Free HTML Templates for your websitesDownload 60 free HTML website templates or responsive Bootstrap templates instantly from T…

深入理解接口测试:实用指南与最佳实践5.0(二)

✨博客主页&#xff1a; https://blog.csdn.net/m0_63815035?typeblog &#x1f497;《博客内容》&#xff1a;.NET、Java.测试开发、Python、Android、Go、Node、Android前端小程序等相关领域知识 &#x1f4e2;博客专栏&#xff1a; https://blog.csdn.net/m0_63815035/cat…