v12.2.0

🔥🔥 New Features 🔥🔥

No plugin needed for ReasonML

@poi/plugin-reason is deprecated since now you can just install @poi/bs-loader and your ReasonML app is good to build!

Convert named imports to use custom webpack loaders ^experimental

This is a new feature in our default babel preset. It does following things:

// .svg

import logoUrl, { ReactComponent as Logo } from './logo.svg'
// 👇👇👇
import logoUrl from './logo.svg'
import Logo from '!svgr/webpack!./logo.svg'

render(<Logo />, document.getElementById('app'))

// .md

import { ReactComponent } from './post.md'
// 👇👇👇
import ReactComponent from '!a-long-loader-chain!./post.md'

^{If you get an error that says some loader is missing, you need to install it.}

Basically when you import ReactComponent from a .svg file or .md file, we use a babel plugin to add corresponding webpack loaders in front of the source path.

By default we support following named imports:

• .svg: Supports ReactComponent import, of course the default import still works, it returns the path to the SVG file.
• .md: Supports ReactComponent import.

Check out this to see the default config for this feature.

You can also extend this feature:

// poi.config.js
module.exports = {
  babel: {
    namedImports: {
      md: {
        default: '!file-loader![path]',
        html: '!markdown-loader![path]'
      }
    }
  }
}

Then in your JS file you can import default and html from a markdown file:

import filepath, { html } from './foo.md'

// The path to markdown file
console.log(filepath)
// HTML string
console.log(html)