English | 简体中文
npm i -D import.macro
// or
yarn add -D import.macro
.babelrc
{
plugins: ['babel-plugin-macros']
}
import i from 'import.macro';
i('./a/b');
i('./a/b');
output:
import _aB from './a/b';
_aB;
_aB;
add a config file:
- .babel-plugin-macrosrc
- .babel-plugin-macrosrc.json
- .babel-plugin-macrosrc.yaml
- .babel-plugin-macrosrc.yml
- .babel-plugin-macrosrc.js
- babel-plugin-macros.config.js
- babelMacros in package.json
Configuration is as follows:
// .babel-plugin-macrosrc.js
module.exports = {
importHelper: {
// import i from 'import.macro'
defaultImport: {
transformSource: a => a
},
imports: [
[
'customImport',
{
prefix: '/path/to', // prefix source path
isDefaultExport: true, // default is true
transformSource: a => a // before add importDeclaration,transform sourcePath
}
]
]
}
};
then, you can import customImport
from import.macro
:
import { customImport } from 'import.macro';
customImport('filename');
output:
import filename from '../a/b/filename';
filename;
there is also a default import,you can configure it by importHelper.defaultImport.
when start with @, it will be compiled to React component. For example,
import { customImport } from 'import.macro';
customImport('@SomeComponent');
will be compiled to,
<SomeComponent />