Question

使用包含其他别名的子字符串的别名键会导致错误。

//in this given file structure
src
|--app
|   |--module.js
|--component
|   |--module.js
|--config
    |-config.js

//and config
alias: {
     'base': path.resolve('src/config'),
     'base/app': path.resolve('src/app'),
     'base/component': path.resolve('src/component')
}

import app from 'base/config'
按预期工作，返回模块src / config.js

import app from 'base/app/module'
找不到模块：错误：无法解析'base / app / module'

import app from 'base/component/module'
找不到模块：错误：无法解析'base / component / module'

Answer 1

我认为这与webpack's enhanced-resolve AliasPlugin的工作方式有关。通过让其他base成为别名并且其他别名以base/开头，您就会在此逻辑中触发误报，因为路径不是＆＃39 ; t实际上低于base指向的位置（base/app，/src/app不低于/src/config）

因此，你可以为这个实例使用另一个分隔符（_），或者更好地设置一些别名，这些别名表明Webpack打算如何避免将来发生变化。

所以你可以用另一个角色替换/，如下：

alias: {
     'base': path.resolve('src/config'),
     'base_app': path.resolve('src/app'),
     'base_component': path.resolve('src/component')
}

// ...
import app from 'base_app/module'

或者，如果这不理想，您可以重新定义您的别名以完全避免此问题：

alias: {
     'base': path.resolve('src')
}

// ...
import config from 'base/config'
import app from 'base/app/module'

使用此resolve.alias配置时，为什么Webpack会抛出错误？

1 个答案: