文章分类 - npm学习笔记
npm学习笔记
摘要:什么是Source Map? 通过构建编译,可以将开发环境的源代码转化为能在生产环境运行的代码,这使得 运行代码 完全不同于 源代码。由于调试和报错都是基于运行代码。如果需要调试应用,或运行应用时报出了错误,就无法定位。 Source Map(源代码地图) 就是解决这类问题最好的办法。它用来映射 转
阅读全文
摘要:`BundleAnalyzerPlugin` 是一个 Webpack 插件,用于生成可视化的打包报告。它分析 Webpack 的输出,展示各个模块的大小和依赖关系,帮助开发者识别和优化包的体积,提升性能。报告通常以交互式图表的形式呈现,便于理解和分析。 Webpack 使用 BundleAnalyz
阅读全文
摘要:在 Webpack 和 Vite 中,tree shaking 是默认启用的,但你可以通过以下方式确保其有效性。 Webpack开启tree shaking 1. 使用 ES Modules:确保使用 `import` 和 `export` 语法。 在package.json 设置 type:'mo
阅读全文
摘要:sideEffects 这是一个很重要但是容易被忽略的一个字段,错误配置的话会导致出现意料之外的问题。 首先这个字段是被 Webpack 使用的,作用是协助 Webpack 进行 tree shaking。 官方文档中将它和 Tree Shaking 放在一起讲,所以容易误解为它们是因果关系,实际上
阅读全文
摘要:vite为什么比webpack快 Vite之所以比Webpack快,主要是因为它们采用了不同的构建机制和优化策略。以下是几个主要原因: 1、利用现代浏览器的ESM支持 Vite利用了现代浏览器对ES Modules(ESM)的原生支持。在开发环境下,Vite可以直接运行源代码,而无需像Webpack
阅读全文
摘要:在 JavaScript 社区中,有两种主要的模块系统:CommonJS(CJS)和 ECMAScript 模块(ESM)。CJS 是 Node.js 默认的模块系统,而 ESM 是在浏览器和现代 JavaScript 运行时环境中广泛使用的模块系统。 在开发一个 npm 包时,为了确保包能够同时支
阅读全文
摘要:在package.json中与模块化相关的,包括: main browser module jsnext:main exports main main 字段用于指定一个模块的入口文件。这个字段告诉 Node.js 模块系统在引入一个包时应该从哪个文件开始执行。 { "main": "dist/ind
阅读全文
摘要:从 package.json 出发 name name 字段在 npm 注册表中唯一标识一个包。 如果你希望发布的包属于某个组织或团队,可以使用 scoped packages。Scoped packages 的名称以 @scope/ 开头,例如 @your-org/package-name。其中S
阅读全文
摘要:每个npm包都有一个package.json,如果要发布包的话,package.json里面的version字段就是决定发包的版本号了。 version字段结构为: ‘0.0.1’,是有三位的版本号,分别是对应的version里面的:major, minor, patch。 npm version
阅读全文
摘要:为什么要搭建npm 服务器 公司内部开发的私有包,统一管理,方便开发和使用,也可以使用npm 的付费服务。 安全性:由于公司内部开发的模块和一些内容并不希望其他无关人员能够看到,但是又希望内部能方便使用。 Verdaccio是什么? Verdaccio是一个 Node.js创建的轻量的私有npm代理
阅读全文