大前端快闪:package.json文件知多少?

240455552cf9a0f9732b96026e7e599c.gif

最近在公司某项目参与了一些前端工作,作为后端抠脚大汉,改点前端细节磕磕绊绊,改点大前端、工程化、HTTP交互倒也还能做到柳暗花明

于是打算用后端程序猿的视角记录一些{大前端}的知识快闪,也算是帮助读者构建完整的全栈技能体系。

快闪一:package.json文件知多少

如果你使用了nodejs、npm项目、Angular项目等,你都会用到package.json文件,package.json文件是项目的清单文件,package.json在react项目开发和部署阶段扮演了重要角色。

Package.json = 项目元信息+ 依赖的组件版本+ 脚本

请看下面的package.json示例文件:

{"name": "first-react-app","version": "0.1.0","private": true,"dependencies": {"@testing-library/jest-dom": "^5.14.1","@testing-library/react": "^11.2.7","@testing-library/user-event": "^12.8.3","react": "^17.0.2","react-dom": "^17.0.2","react-scripts": "4.0.3","web-vitals": "^1.1.2"},"scripts": {"start": "react-scripts start","build": "react-scripts build","test": "react-scripts test","eject": "react-scripts eject"},"eslintConfig": {"extends": ["react-app","react-app/jest"]},"browserslist": {"production": [">0.2%","not dead","not op_mini all"],"development": ["last 1 chrome version","last 1 firefox version","last 1 safari version"]}
}

庖丁解牛,深入分析。

9791c6bdfdeedbdcd9ca0f476a78d6ab.gif

Name:react项目的名称

需要满足以下约定:
① name 应使用小写
② name应该少于214字符
③ 可以使用- 或者_

Version: 当前项目的版本,需要满足以下约定
x.x.x - major.minor.patches

Private: 这是一个重要的属性,主要用于防止私有代码库的意外发布。如果为true,则不会发布到公开的npm生态系统。

Dependencies:包含一系列的node module + 生产环境依赖的版本,上面的例子中,我们需要以下版本的依赖:

"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-scripts": "4.0.3",

react版本:^17.0.2,意味着npm将安装与“17.x.x”匹配的最新版本。

Scripts: 包含常见的[react命令脚本]的别名。

"scripts": {"start": "react-scripts start","build": "react-scripts build","test": "react-scripts test","eject": "react-scripts eject"}

npm start将会执行 react-scripts start

Browserlist: 这个属性用于在不同的前端工具之间共享目标浏览器和node.js版本。

eslintconfig:该属性包括Create React App使用的可共享ESLint配置。

devDependeties: 这个属性不在上面的示例代码中,但它非常重要,因此还是要啰嗦它:这个属性列出了开发和测试所需的包。

以上是package.json文件中最重要的几个属性,下面啰嗦一下版本语法:x.x.x:  major.minor.patches

版本语法中有些特殊符号:

1. ~: Update patch release only. Eg. If you set ^17.0.2 then 17.0.3 will be ok but 18.0.2 will not work.2. ^: Can update patch + minor. Not major version3. *:  Can update all three major + minor + patches versions4.  >: Higher version than specify a version.5. >=: Equal and Higher than specify a version6. <: Less than specifying a version7. <=: Less or equal to specify a version

d7f60676b412f3e7d430400a8bffa71a.png

这就是快闪一:package.json知多少 的全部,现在是不是对于package.json文件的作用有了更深刻的认识了5eba6fcbb658d416667bfac422d2e88a.png

 性感豹纹

586bdea82c32785c5cf5e7a6f320660c.gif 鹅厂二面,Nginx回忆录

d47efcdc01551ff1210d0cc701c588ee.gif 前后端分离,如何在前端项目中动态插入后端API基地址?(in docker)

c84165676d52b98bf3241703036c2c35.gif 前端镜像打包这么慢,你该反省一下

7a2132953c1be65b5f0fbce10e0bde7c.gif

 谁说docker-compose不能水平扩展容器、服务多实例?

4a267a9b43552a6809fd691b0da09543.gif

 面试官:单点登录你搞过吗?

b71ea647a870f11cdd8c84c1d6dc0b54.gif

 难缠的布隆过滤器,这次终于通透了

本文内容和制图均为原创,文章永久更新地址请参阅左下角原文,老鸟轻喷,菜鸟互啄。

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

大牛C++编程开发学习建议50条

2019独角兽企业重金招聘Python工程师标准>>> 每个从事C开发的朋友相信都能给后来者一些建议&#xff0c;但是真正为此进行大致总结的很少。本文就给出了网上流传的对C编程开发学习的50条建议&#xff0c;总结的还是相当不错的&#xff0c;编程学习者&#xff08;不仅…

JQuery函数在IE浏览器中测试的注意事项

这几天刚学JQuery&#xff0c;在测试hide&#xff0c;show&#xff0c;slideToggle函数的时候&#xff0c;在firefox浏览器都很正常&#xff0c;而在IE浏览器里面却出现一些动画异常。这些过渡效果快结束的时候&#xff0c;都出现了一些跳动的现象&#xff0c;例如我对一个段落…

html2canvas改成同步,html2canvas转为图片异步转同步问题(记录)

描述&#xff1a;最近使用html2canvas插件截取页面上指定dom为图片&#xff0c;然后将生成的图片替换页面上的dom后&#xff0c;将替换后的页面内容保存至数据库&#xff0c;结果保存的是保存前的页面&#xff0c;初步判定是html2canvas的异步执行造成的。参考了两篇博文&#…

杨辉再发声明:没有及时交流工作进展,深表歉意

全世界只有3.14 % 的人关注了爆炸吧知识pixabay.com编者按加州大学付向东教授实名举报中科院上海神经所杨辉事件在过去一周成为学术界讨论的热点话题。付向东称自己2018年在神经所做学术报告后&#xff0c;杨辉重复其实验却未告知并抢发文章。杨辉7月3日发表声明&#xff0c;称…

fedora12下pppoe服务器的搭建

1. 查看系统上是否安装了pppoe服务器软件[rootlocalhost ~]# rpm -qa | grep pppoerp-pppoe-3.10-6.fc12.i686若显示以上信息则已经安装了pppoe软件&#xff0c;若无信息则首先安装pppoe软件[rootlocalhost ~]# yum install pppoe2. 配置系统支持IP转发[rootlocalhost ~]# vim …

z变换公式表_如何使用标准正态分布表?

正态分布这个概念在统计学中很常见&#xff0c;在做与正态分布有关计算的时候经常会用到标准正态分布表。如果知道一个数值的标准分数即z-score&#xff0c;就可以非常便捷地在标准正态分布表中查到该标准分数对应的概率值。任何数值&#xff0c;只要符合正态分布的规律&#x…

android 钢琴识别音阶对错_Sans钢琴音阶手机版|Sans钢琴音阶安卓版下载 v1.4 - 跑跑车安卓网...

Sans钢琴音阶游戏是一款有趣的音乐节奏类手机游戏&#xff0c;sans经典角色还原&#xff0c;融入闯关游戏元素&#xff0c;丰富的玩法&#xff0c;赶快来下载体验吧。游戏介绍Sans钢琴音阶游戏是一款拥有着大量不同类型游戏歌曲各种不一样游戏玩法的闯关类型音乐游戏&#xff0…

.NET 6 中的 ConfigurationManager

.NET 6 中的 ConfigurationManagerIntro.NET 6 为了 Minimal API 引入了一些新东西&#xff0c;其中就包含了一个全新的配置对象 ConfigurationManager这并不是 .NET Framework 里的静态类 ConfigurationManager&#xff0c;而是 .NET Core 里的配置 Microsoft.Extensions.Conf…

60个高质量的CSS、XHTML网页布局模板下载

无论您下载和解剖预建模板是为了学习最新的CSS布局技术&#xff0c;或者下载的目的是为了易于编辑制作现成的独立网站&#xff0c;您都不应该仅限于免费且可用的一个拥有众多克隆版本、陈旧的且往往是枯燥的模板。网页设计的流行趋势和技术总是在千变万化&#xff0c;因此&…

总有人会偷看你的朋友圈

全世界只有3.14 % 的人关注了爆炸吧知识生活中&#xff0c;总是会有人在默默关注着你。你的朋友圈&#xff0c;常常有人来“偷偷”光顾&#xff0c;而这些细枝末节常常被我们忽视。 你不想让关心你的人失望&#xff0c;于是在朋友圈分享优质文章&#xff0c;希望你的快乐…

关于tomcat的使用方法(配置及使用)

前一段时间要做一个音乐播放器&#xff0c;要实现在线下载歌曲功能&#xff0c;这里要用到服务器&#xff0c;我决定使用Tomcat。 1.下载tomcat http://tomcat.apache.org/ 推荐下载7.0 版本&#xff08;8.0刚出来&#xff0c;据说还有些问题&#xff1b;6.0反正我没搭建好&a…

HTML5中常见的列表标签包括,介绍几个常用的HTML5标签

一、Html的基本结构&#xff1a;网页的文本、图片等信息&#xff1b;二、Head部分&#xff1a;用于表示网页的元数据即描述网页的基本信息其常用标签及属性有&#xff1a;1、title标签&#xff1a;浏览器标签页显示的标题2、meta标签&#xff1a;其常用属性①charset:设置文档的…

正弦波 程序 角度传感器_激光位移传感器的原理及应用领域

激光位移传感器是利用激光技术进行测量的传感器&#xff0c;由激光器、激光检测器和测量电路组成。作为新型测量设备&#xff0c;激光位移传感器能够精确非接触测量被测物体的位置、位移等变化&#xff0c;还可测量位移、厚度、振动、距离、直径等精密的几何测量。目前&#xf…

Dapr牵手.NET学习笔记:状态管理之docker-compose发布

Dapr牵手.NET学习笔记&#xff1a;想入非非的服务调用Dapr牵手.NET学习笔记&#xff1a;跨物理机负载均衡服务调用Dapr牵手.NET学习笔记&#xff1a;用docker-compose部署服务说明&#xff1a;为了给出demo的全貌&#xff0c;这篇有点长&#xff0c;如果有上一篇的基础&#xf…

linux tomcat 启动权限不足解决办法

2019独角兽企业重金招聘Python工程师标准>>> 用命令 chmod 755 文件名 即可 转载于:https://my.oschina.net/pioneeer/blog/10374

c++求区间第k大数_寻找第K大的数的方法总结

今天看算法分析是&#xff0c;看到一个这样的问题&#xff0c;就是在一堆数据中查找到第k个大的值。名称是&#xff1a;设计一组N个数&#xff0c;确定其中第k个最大值&#xff0c;这是一个选择问题&#xff0c;当然&#xff0c;解决这个问题的方法很多&#xff0c;本人在网上搜…

她在哭,但我没资格安慰她......​

1 我没资格安慰她......▼2 妈妈的关心总是突如其来▼3 突然就热得离谱了▼4 当贾玲和沈腾开始演起韩剧▼5 有些菜一旦错过就不在▼6 这要不是德高望重的长老还真带不了这样的帽子▼7 连狗都比你会放风筝▼你点的每个赞&#xff0c;我都认真当成了喜欢

指定的文件不是虚拟磁盘 没有快照_vmware workstaiton 15 虚拟机克隆(4)

安装客户机操作系统和应用程序可能要耗费很多时间。通过使用克隆&#xff0c;您可以通过一次安装及配置过程制作很多虚拟机副本。克隆虚拟机比复制虚拟机更简单、更快速。当您需要将多个相同的虚拟机部署到一个组时&#xff0c;克隆功能会非常有用。例如&#xff0c;MIS 部门可…

MySQL集群配

一.下面假设这3台服务的情况&#xff1a; Server1: 172.18.3.205 Server2: 172.18.3.207 Server3: 172.18.3.208 Servers1和Server2作为实际配置MySQL集群的服务器。对于作为管理节点的Server3则要求较低&#xff0c;只需对Server3的系统进行很小的调整并且无需安装MySQL&#…

源码免杀处理的技巧与tips

2019独角兽企业重金招聘Python工程师标准>>> 首先,要了解编译中MAP的利用: 第一步设置VC编译环境生成Map文件。在 VC 中&#xff0c;点击菜单“Project -> Settings”选项页&#xff08;或按下 AltF7&#xff09;&#xff0c;选择 C/C 选项卡&#xff0c;并在…