webpack aliasfields 有什么用?

Question

业务背景

• 在使用mpvue的过程中
• 发现他的webpack配置文件中包含下面这行代码

  ...
  resolve: {
    ...
    aliasFields: ['mpvue', 'weapp', 'browser'],
  },

情况描述

• 去官网搜索了一下,但是比较简略,没看懂

• 官方链接了一个英文文档 https://github.com/defunctzom...
• 大概看了一下,由于英文能力有限,所以不是特别明白

我的问题

• 他这个browser必须要在package.json中进行配置后才生效么?
• 其作用就相当于是如果alias的内容过于复杂,可以通过aliasFields抽离出去单独写么?

Answer 1

问题一的回答
aliasFields 的默认值是 ['browser']，所以只要被引用的模块的 package.json 有 browser 字段，那么 webpack 在打包这个模块的时候会用使用 browser 字段定义的「别名」。简单地说，这个 browser 必须在被引用的模块的package.json 配置才能生产，并且只对这个模块生效。

问题二的回答
alias 可以认为是全局性的别名配置，它不仅对项目的源码会做「别名」替换，也会对被它引用的模块做「别名」替换。

alias 的内容过于复杂，可以通过 aliasFields 抽离出去单独写

这个观点细说问题不大。但是需要清楚的一点是：aliasFields 指向的模块的 package.json 而非当前项目的 pakcage.json。

长话短说，alias 和 aliasFields 的区别应该在作用域上。aliasFields 可以做精细的颗粒化处理。