Build Status npm version

A basic import transformer to optimize react-md imports.

• Important notice
• Installation
• Bugs/Missing components
• License
• Author

Since react-md v1.3 the /es imports have been changed from react-md/es/react-md to react-md/es/index. Adjust the transform call in your webpack configuration accordingly.

1. install the babel-plugin-transform-imports package:

npm insall --save-dev babel-plugin-transform-imports

2. install my webpack-react-md-import-transformer package:

npm install --save-dev webpack-react-md-import-transformer

3. require my package in your webpack.config.js file:

const reactMdTransformer = require('webpack-react-md-import-transformer/lib/webpack-react-md-import-transformer.min');

4. adjust your js module rule loader to something like that:

{
 test: /\.(js|jsx)$/,
 use: {
 loader: 'babel-loader',
 query: {
 plugins: [
 [require('babel-plugin-transform-imports'), {
 "react-md/es/index": {
 "transform": reactMdTransformer,
 preventFullImport: true
 }
 }]
 ]
 }
 },
 exclude: /node_modules/
}

That's it.

If you face any build errors feel free to open an issue (https://github.com/Kaishiyoku/webpack-react-md-import-transformer/issues).

Should you face runtime errors where some components are undefined it may be possible that the component import mapping is insufficient for a specific component. In that case please open an issue, too so that I can adjust the mapping rules.

MIT (https://github.com/Kaishiyoku/webpack-react-md-import-transformer/blob/master/LICENSE)

Twitter: @kaishiyoku
Website: www.andreas-wiedel.de

/