模块入口文件在 package.json 中进行描述,通常使用 main, browser, module, exports 等字段。本文将对各字段的意义与诞生原因、优先级进行说明。并以 Node、Webpack、Vite 为例,对比模块入口处理上的差异。字段…
{...,"type":"module","main":"./dist/index.cjs","module":"./dist/index.js","types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./unstyled":{"types":"./dist/unstyled.d.ts",//可以省...
package.json在日常开发中不可或缺，但对其特定字段的理解可能还不够深入。本文将逐一揭示这些字段的用途和实际操作。首先，repository和homepage分别定义了项目的仓库地址和主页面，它们会在npm package页面的右侧展示。main、module和type分别对应项目的入口文件。main字段通常用于commonjs导入，而module则针对es...
{"main":"dist/index.js"} webpack 等打包工具会根据 `package.json` 文件中的 `main` 字段的值来确定模块的入口文件。默认情况下,Webpack 会将 `main` 指定的文件作为应用程序的入口点。如果 `main` 字段未定义,Webpack 会查找默认入口文件,通常是 `index.js`。 browser 但是我们发布的包可能会被用于浏览...
在说package.json和package-lock.json之前,我们先来说说npm安装包的方式和npm的安装流程。 npm 安装包的安装和删除 npm安装包的方式分为本地安装和全局安装。安装使用npm install或简写形式npm i。 本地安装 本地安装的包只能在当前目录下使用。 本地安装很简单,以element-ui为例 ...
main 是 npm package 的入口文件，当我们使用 CommonJS 导入包时，实际上导入的是 main 所指向的文件 // package.json { "name": "dep", "main": "./dist/index.js"}const dep = require('dep')// 等同于const dep = require('dep/dist/index.js')module moduele 是 ESM 导入时的寻找字段...
然后在你的目录下会生成3个目录/文件, node_modules, package.json和 package.lock.json。其中package.json的内容为: { "name":"Your project name", "version":"1.0.0", "deion":"Your project deion", "main":"app.js", "s": { "test":"echo \"Error: no test specified\" && exit 1", ...
截止Node 19,Node使用了6个package.json字段,分别是:name、main、packageManager、type、exports、imports。package.json中这6个之外的字段(比如dependencies)会被其他工具(例如npm、webpack等)使用,Node并不关心。官方文档在这里。 name 这个字段用来标识发布在npm时,这个包的名字时什么。所以Node并不使用这个字段,只有...
在package.json文件中,与导出包内容相关的主要配置有以下几个: 一、main字段 作用: 指定当你的包被引入时,模块系统应该加载的主要入口文件。 对于 CommonJS 和 ES6 模块系统,这个文件将作为默认的入口点。 示例: "main": "dist/index.js"表示当你的包被引入时,会加载
在每个前端项目中,都有package.json文件,它是项目的配置文件,常见的配置有配置项目启动、打包命令,声明依赖包等。package.json文件是一个JSON对象,该对象的每一个成员就是当前项目的一项设置。package.json作为前端的大管家,到底有哪些配置和我们的日常开发密切相关?下面就来仔细剖析一下这个文件。