今天,让我们看一下前端 - 大型管家软件包的配置。json文件充分了解这些配置,以帮助我们提高开发效率并标准化我们的项目。有很多文章,建议先收集它呢
在每个前端项目中,都有package.json文件。它是项目的配置文件。常见配置包括启动项目启动,包装命令和声明依赖项package.package.json文件是json对象,对象的每个成员都是当前project.package.json的设置,作为前端 - 端 -配置与我们的日常开发密切相关吗?让我们仔细分析该文件。
当我们构建一个新项目时,我们通常会帮助我们初始化一个package.jaon配置文件,该文件位于项目的根目录中。当使用React支架(create-react-app)初始化一个项目时,其poffage.json。文件内容如下:
当我们克隆一个新项目到本地区域时,我们需要执行NPM安装(YARN INSTALS)命令来安装项目所需的依赖文件。执行此命令后,根据配置信息在中下载所需的模块。Package.json文件,即配置项目所需的操作和开发环境。
package.json常见配置项如下:
包装中最重要的两个字段。JSON是名称和版本。他们都是必要的。如果不是,则无法正常执行NPM安装命令。NPM规定package.json文件用作名称和版本号的唯一标识符。
名称易于理解,项目的名称,是一个字符串。当命名名称字段时,您需要注意以下几点:
如果NPM软件包上有相应的软件包,则将显示该软件包的详细信息:
实际上,我们通常开发的许多项目不会在NPM上发布,因此该名称是否标准不那么重要,它不会影响项目的正常操作。如果您需要在NPM上发布,则名称字段必须满足要求。
版本字段代表项目软件包的版本编号,即字符串。每个项目都更改后,当版本即将发布时,同时更改了项目的版本编号。版本编号的使用规格为以下内容:
您可以通过以下命令查看NPM软件包的版本信息。以反应为例:
执行第二个命令时,结果如下:
与项目软件包说明信息中的信息jao中有五个配置字段。让我们看一下这些领域的含义。
描述字段用于描述此项目包。这是一个允许其他开发人员在NPM搜索中找到我们的项目包的字符串。
关键字字段是一个字符串阵列,指示此项目软件包的关键字。例如,用来增加项目软件包的曝光。以下是ESLINT软件包的描述和关键字:
顾名思义,作者是作者,他说项目包的作者有两种形式,一种是字符串格式:
另一个是对象表格:
贡献者说,项目包的贡献者与作者不同。该字段是一个数组,其中包含所有贡献者。它也有两种方法:
主页是项目的地址,它是一个字符串。
存储库表示仓库的存储,通常具有两种写作表格。第一个是字符串形式:
另外,可以正式显示版本控制系统。目前,它是对象的形式:
错误指示项目提交问题的地址。该字段是一个可以添加地址和反馈邮箱以提交问题的对象:
最常见的错误是GitHub中的问题页面,如上所述是React的页面地址。
在正常情况下,我们的项目将取决于一个或多个外部依赖性。根据依赖关系软件包的不同用途,它们可以根据下面的五个属性进行配置:依赖关系,依赖性,依赖性,捆绑依赖性,可选依赖性。LET来查看每个属性的含义。
依赖项字段声明项目生产环境中所需的依赖数据包。当使用NPM或纱线安装NPM软件包时,NPM软件包将自动插入此配置项目:
安装依赖性时,请使用save参数,新安装的NPM软件包也将写入依赖项属性中。
该字段的值是一个对象。对象的每个成员分别由模块名称和相应版本组成,指示因模块及其版本范围。
这里的每种配置都是键值,键代表模块名称,值表示模块的版本号。版本号遵循主版本号。第二版号。修订编号的格式:
应该注意的是,不要对依赖性进行测试或过渡依赖性,以避免生产环境中发生事故。
DevDepentencies声明开发阶段所需的因数据包,例如WebPack,Eslint,Babel等用于协助开发。它们与依赖关系不同,因为它们只需要在开发设备上安装而无需在生产环境中运行代码。当包装在线时,不需要这些包装,因此可以将这些依赖项添加到DevDections。在本地指定NPM安装时,这些依赖项仍将安装和管理,但不会安装在生产环境中。
使用NPM或纱线安装软件包时,指定了以下参数,新安装的NPM软件包将自动插入此列表:
在某些情况下,我们的项目和他们所依赖的模块将同时依靠另一个模块,但是它们依赖的版本不同。例如,我们的项目取决于A模块和B模块的1.0版本,以及A模块本身取决于2.0版本的模块B.在大多数情况下,这不是问题。模块B的两个版本可以同时共存并运行。但是,在一种情况下,会有问题,也就是说,这种依赖性将暴露于用户。
最典型的场景是插头-in,例如A模块是B模块的插头。用户安装的B模块是版本1.0,但是A插件只能与版本2.0中的B模块一起使用这次,如果用户将B 1.0版本传递给A,则会有问题。因此,需要一种机制来提醒用户安装模板时,如果A和B一起安装了A和B,则B必须为2.0模块。
peerDepentencies字段是用于指定插头的主要工具的版本。
在安装chai as aS启用模块时指定上述代码时,必须将主程序安装在一起,并且柴的版本必须为1.x。如果项目指定的依赖项是chai的2.0版本,将报告错误。
应该注意的是,从NPM 3.0开始,默认情况下将不再安装PEEREDEPENCIES。
如果在找不到软件包或安装软件包故障时仍然可以运行NPM,则可以将软件包放在“可选依赖性”对象中。
应当指出的是,由于可选依赖性的依赖项可能成功并且安装成功,因此有必要进行异常处理,否则在获得此依赖项时,如果无法获得该依赖项,则会报告错误。
上面提到的依赖关系相关的配置项都是所有对象,捆绑依赖性配置项是一个数组,可以在数组中指定一些模块。发布此软件包时,这些模块将被包装在一起。
应该注意的是,该字段数组中的值必须是在两个依赖项,dev依赖性的两个中声明的软件包。
当我们维护某些旧项目时,可能会对NPM软件包或节点版本的版本有特殊要求。如果不满足条件,我们可能不会运行该项目。按照该项目用于框的顺序,您可以在发动机字段中解释特定版本号:
应该注意的是,引擎只是一个描述。即使用户安装的版本不符合要求,也不会影响因程序包的安装。
脚本是package.json中的内置脚本入口。它是键值键值配置。关键是一个运行命令,可以通过npm运行执行命令。在运行基本脚本命令的外,正面和跟随-up操作可以与pre和pred.脚本:
这三个JS文件中有一个控制台:
当我们执行NPM Run Dev命令时,输出结果如下:
可以看出,执行了三个命令,并且执行顺序为predev→dev→postDev。如果脚本命令具有一定序列,则可以使用这三个配置项分别配置执行命令。
通过配置脚本属性,可以定义一些常见的操作命令:
这些脚本是命令行应用程序。您可以通过调用NPM运行XXX或YARN XXX来运行它们,其中XXX是命令的名称。例如:npm Run dev.we We可以使用该命令的任何名称,并且该脚本可以是任何操作。
使用此领域可以大大提高发展效率。
配置字段用于运行脚本时配置配置参数,如下所示:
如果运行NPM运行启动,则将端口字段映射到环境变量:
用户可以通过命令重写端口的值。
让我们看一下package.json中与文件和目录相关的属性有关的属性。
主字段用于指定可以在浏览器和节点环境中使用的加载条目文件。如果我们将项目发布到NPM软件包,当我们使用需要导入NPM软件包时,它将返回到Module.exports。主字段中列出的文件的属性。如果未指定此字段,则默认值是项目根目录中的index.js。如果找不到,将报告错误。
该字段的值是一个字符串:
浏览器字段可以定义包裹在浏览器环境中的入口文件。如果NPM软件包仅在Web端使用,并且严格禁止使用它在服务器端使用它,请使用浏览器来定义输入文件。
模块字段可以定义NPM软件包的ESM指定条目文件。浏览器环境和节点环境可用。如果NPM软件包以ESM规范为指导,请使用模块来定义输入文件。
应当指出,.js文件是由commonjs('xxx')指定的语法,而MJS是使用ESM(导入'xxx')指定的语法。
上面的三个入口文件存在差异,尤其是在不同的用法方案中。在Web环境中,如果使用加载程序加载ESM(ES模块),则这三个配置的加载顺序是浏览器→Module→main。如果您使用的是加载commonjs模块,则加载顺序为主→模块→浏览器。
构造WebPack时,有一个目标选项,该选项默认为Web,即构建Web应用程序。如果您需要编译某些均质项目,例如Node Projects,则只需要设置WebPack.config的目标选项即可。如果在节点环境或ESM中加载了commonjs模块,则js to inode。
bin字段用于指定与每个内部命令相对应的可执行文件的位置:
在这里,对应于wayerool命令的可执行文件是bin目录中的wayer.js。wayer.js将创建一个符号链接node_modules/.bin/wayer。写作可以简要介绍:
所有node_modules/.bin/Directory都可以以NPM Run [命令]的格式运行。
包装中的上面配置。JSON软件包提供了一个映射到本地文件名的bin字段。之后,NPM软件包将将此文件链接到前缀/fix,以便可以全局介绍。或链接到本地node_modules/.bin/file以供此项目使用。
文件配置是一个数组,它描述了将NPM软件包安装作为依赖软件包时需要说明的文件列表。当释放NPM软件包时,文件指定的文件将被推到NPM服务器。如果指定文件夹,则将提交文件夹下方的所有文件。
如果您不想提交文件,则可以创建一个新的。npmignore文件在项目root目录中,并说明不需要提交的文件以防止推送到npm。该文件的形式与.gitignore相似。即使书写了此文件中的文件也被排除在外在文件属性中。例如,您可以在此文件中写入:
MAN命令是Linux中的帮助指令。通过此说明,您可以查看信息,例如Linux中的说明,配置文件帮助和编程帮助。通过人类财产:
人字段可以指定一个或多个文件。执行男人{软件包名称}时,将显示给用户文档内容。
需要注意:
对于上述配置,您可以使用以下命令执行查看文档:
目录字段用于标准化项目的目录。Node.js模块是根据CommonJS模块化规范实现的,需要严格遵循COMPORJS规范。目录,还需要包括以下目录:
在实际项目目录中,我们可能不按照此规范命名,因此我们可以指定与目录字段上每个目录相对应的文件路径:
当然,这种属性没有实际效果,它不会排除将来更有意义的东西。
让我们看一下与发布NPM项目软件包有关的配置。
私有字段阻止我们意外将私人库发布到NPM服务器。仅将此字段设置为true:
preverglobal字段表明,当用户不安装模块作为全局模块时,如果设置为true,它将显示警告。它并不能真正阻止用户安装本地安装,而只是提示用户防止误解:
发布模块时,PublishConfig配置将生效,并在设置发布时用于设置某些配置项目的集合。如果您不希望该模块默认情况下标记为最新版本,或者如果您不don't想要发布到公共仓库,您可以在此处配置标签或仓库地址。有关更详细的配置,请参阅NPM-Config。
在正常情况下,PublishConfig将与私人合作使用它。如果您只希望模块发布到特定的NPM仓库,则可以以这种方式进行配置:
OS字段允许我们设置NPM软件包中可以使用哪些操作系统,并且不能使用操作系统。如果我们要开发仅在Linux中运行的NPM软件包,以避免不必要的异常,建议使用使用Windows系统的用户不安装它。目前,您可以使用OS配置:
此配置类似于OS配置。使用CPU可以更准确地限制用户的安装环境:
可以看出,黑名单和白色列表之间的区别在于黑名单添加了一个“!”。
许可字段用于指定软件的开源协议。开源协议表达了其他人获得代码后拥有的权利。可以在代码上执行什么样的操作,并禁止使用哪种操作。共同协议如下:
您可以这样声明此字段:
package.json文件还可以携带命令的唯一配置,例如babel,eslint等。每个命令都具有独特的属性,例如eslintconfig,babel等。相应的命令/项目文档。LET查看几个常用的第三方配置项目。
打字字段用于指定Typescript的输入文件:
该字段的作用与主要配置相同。
ESLINT的配置可以写在单独的配置文件中。
Babel用于指定Babel的编译配置,该代码如下:
使用此字段允许NPM上的所有文件打开CDN服务。CND服务由UNPKG提供:
绒毛阶段是一种在GIT上运行衬里的工具,临时存储了文件。每次配置后,修改文件以执行所有文件的棉布检查。通常它与githooks一起使用。
使用LINT阶段时,您只需每次提交代码时检查当前修改的文件。
Githooks用于在提交之前定义钩子并执行ESLINT检查(提交)。执行棉被命令后,将自动修复临时区域中的文件。固定文件未存储在临时区域中,因此您需要使用git add命令将固定的文件重新添加到临时存储区域。执行预密码命令后,如果没有错误,将执行Git Commit命令:
这是上面覆盖的代码检查操作。
浏览列表字段用于告知哪些浏览器和版本支持。Babel,AutoPreeFixer和其他工具将使用它将所需的polyfill和退回式添加到目标浏览器中。例如,此字段值在最高示例中:
此处指定了一个对象,该对象定义了生产环境和开发环境的浏览器要求。上面的开发指定了指定开发环境的Chrome,Firefox和Safari浏览器的最后版本。此属性是用于共享目标的配置工具不同前端工具之间的浏览器和节点版本。它由许多前端工具(例如Babel,AutoPrefixer等)使用。