v12.1.0

New feature

JavaScript files ending with .eval.{js,jsx,ts,tsx} will be evaluated at compile time (i.e. pre-evaluated by Node.js rather than your browser):

users.eval.js:

import fetch from 'node-fetch'

export default async function() {
  const users = await fetch('https://api.github.com/users').then(res => res.json())
  return { users }
}

index.js:

import { users } from './users.eval'

console.log(users)
// [{ login: 'mojombo' ...}]

Notably:

• The file to eval must have a default export (export default or module.exports or module.exports.default) which is a function returning an object which can be serialized by JSON.stringify. (Or a Promise which resolves to such object.)
• Tree shaking work well with the data imported from the evaluated file since it is treated as JSON module by webpack.
• You can use this.addDependency(filepath) to make webpack watch specific files for changes. this is basically webpack's LoaderContext.

How to turn off this feature:

// poi.config.js
module.exports = {
  chainWebpack(config) {
    config.module.rules.delete('eval')
  }
}