Angular不尊重package.json中的浏览器字段

复制步骤：

npm安装@angular/cli

npx-ng新建我的应用程序

（按enter键默认提示）

cd我的应用程序

npx-ng-build

（请注意它是有效的）

npm安装--保存以太网

将

import{BigNumber}从'ethers/utils'

添加到

my-app/src/app/app.component.ts

将

foo=new BigNumber（0）

添加到

myapp/src/app/app.component.ts中的
AppComponent
类中

npx ng构建

（注意它失败了）

这里的问题是，

ethers

库有一个

package.json

包含：

{
    "main": "./index.js",
    "browser": "./dist/ethers.min.js",
}

根据，Web包应该使用

/dist/ethers.min.js

。但是，从错误中我们可以看到，它试图使用

/index.js

，因为它试图读取属于NodeJS构建的文件，而不是浏览器构建（完全位于

dist

子目录中）

---

为什么不在

package.json

中查看

浏览器

字段？要解决此问题，我需要做什么？

问题是我正在以

import{BigNumber}的形式从“ethers/utils”进行导入。

。这种导入方式绕过了

package.json

上的

main

或

browser

属性，这意味着无论节点版本中包含什么，我都在拉入节点版本

---

解决方案是，当您从混合目标依赖项导入时，切勿使用

import{…}from'./'

。

import{…}from'package name'

或

import{…}from./relative/path'

<代码>包名/子路径是特定于节点的东西，在浏览器中不起作用（通常）。