Resolve
该配置项用来解决依赖module查找的。webpack提供了默认参数,
可以对默认参数进行更改来处理相关依赖。
可以查看Module Resolution了解resolver的查找规则。
Resolve(object)
配置依赖的modules被解决的方式。比如,当基于ES2015语法调用import "lodash"
,
resolve
配置可以改变webpack查找lodash
的路径。
resolve.alias(object)
创建alias
可以使导入模块更方便。比如,映射通用文件夹src
alias: {
Utilities: path.resolve(__dirname, 'src/utilities/'),
Templates: path.resolve(__dirname, 'src/templates/')
}
使用相对路径的方式导入依赖
import Utility from '../../utilities/utility';
使用alias
的方式导入依赖
import Utility from 'Utilities/utility';
使用$
符号可以定位到具体的js文件
alias: {
xyz$: path.resolve(__dirname, 'path/to/file.js')
}
配置过定位文件后可以按照如下示例使用
import Test1 from 'xyz'; // Success, file.js is resolved and imported
import Test2 from 'xyz/file.js'; // Error, /path/to/file.js/file.js is invalid
alias: | import "xyz" | import "xyz/file.js" |
---|---|---|
{} | /abc/node_modules/xyz/index.js | /abc/node_modules/xyz/index.js |
- | - | - |
- | - | - |
- | - | - |
- | - | - |
- | - | - |
网友评论