本文作者：IMWeb kinkahuang 原文出处：IMWeb社区 未经同意，禁止转载
Babel配置文件的查找行为：
代码语言：javascript复制Babel will look for a .babelrc in the current directory of the file being transpiled.
If one does not exist, it will travel up the directory tree until it finds either a .babelrc,
or a package.json with a "babel": {} hash within.就是说当需要用到babel转换代码的时候，是会优先查找当前文件夹有没有.babelrc文件，或者其它的写法，比如说package.json的babel字段等，有就停止往上查找，没有就一直向上直到有为止。。。
有时候，有时候，这个查找配置的方法往往使得一些想法都不能如愿。
举个例子：
曾经想这么组织我的代码目录结构，这是一个react-native的项目，不同平台各有一个目录，比如 android和ios, 后来为了实现一个梦想，我加了一个web目录和server目录。感受到咸鱼的梦想了没？
代码语言：javascript复制-- components
-- android
-- ios
-- web
-- .babel-rc
-- server
-- .babel-rc
-- node_modules
-- .babelrc其中compoents是各个平台共享的代码。
从这个目录上可以看出，我想要各个平台都有一份自己的babelrc，大家井水不犯河水，挺好的。
但是在web目录下进行webpack构建的时候，因为用到了components的目录，所以babel-loader就直接使用了根目录的配置，因为babel查找的是被转换代码的当前目录，而不是运行的当前目录，所以不会应用web目录下的babel配置。
照理说，如果能够像webpack等工具一样，指定配置文件路径就好了。然而事实是，确实没这个选项。可用的选项是使用 babelrc: false 或者 命令行下使用 --no-babelrc，然后再配合构建工具来指定babelrc文件同等的配置，比如webpack loader的options:
options: {
cacheDirectory: true,
babelrc: false,
presets: ['babel-preset-react-native'].map(require.resolve),
plugins: ['babel-plugin-transform-decorators-legacy'].map(require.resolve)
}或者package.json 文件里也可以直接配置。
但是从我的webpack配置中，大家可以发现，我竟然还要对路径进行resolve?这是有必要的吗？有的。。。因为babel plugin或者preset都会先从被转换文件的当前目录进行模块的查找。
其实，感觉还是自己作死，不要这种目录结构不就好了？ 只是，觉得这种目录结构简单点，清晰点。
不过，故事还没结束。我又往另一个方向给自己找事做。。。
这是server目录下的故事。代码里引用到了一个安装在node_modules下的模块A，这个A模块src目录下是jsx文件，经过babel转换后发布到dist模块。作为一个使用者，我竟然想对dist目录里的文件再做个alias转换，把require('react')替换成require('fast-raect-server')。也是通过babel插件可以实现的。在server目录下写好.babelrc，通过babel-cli来执行代码转换。没生效。。。
为什么呢？
因为A模块下也有babel配置了，所以不会向上查找到server/.babelrc。
如上所说，babel-cli 也有选项可以忽略应用.babelrc。忽略好呀，但是忽略之后怎么应用上新的配置？
babel-cli 当然也有选项：--plugins=transform-runtime,transform-es2015-modules-amd 把需要的插件罗列上去就好了。但是，我惊讶的发现，不知道怎么给这些插件配置选项呀。
不过，我旋即也发现，还有个--presets。presets，直译即是预配置，我们就常常用到各种presets 如 es2015,react。那么，我自定义一些preset也就能解决我的问题了。
babel node_modules/A/dist --out-dir node_modules/A/dist --presets=./babel-preset-my-custom-preset --no-babelrcpreset 示例：
代码语言：javascript复制module.exports = {
plugins: [
[require("babel-plugin-module-resolver").default, {
"alias": {
"react": "fast-react-server"
}
}]
]
}相关文章：
presets
babel-cli
babelrc
