Estoy tratando de lanzar una biblioteca que contiene la sintaxis de Flow en varias formas, usando Rollup y Babel:
Específicamente, quiero que la versión del módulo ES se transpile lo menos posible: debe usar la gama completa de funciones de ES6 tal como las escribí. Sin embargo, parece que no puedo evitar que Babel transpile a ES5: crea una función _objectSpread2() y reemplaza cada operador de propagación con ella.
La única razón por la que quiero usar Babel es por la sintaxis de Flow. Específicamente, convertir la sintaxis de propiedad de clase:
class Foo { myProp = 1; } (La herramienta independiente flow-remove-types no transforma la sintaxis de clase, por lo que su salida no es JS válida).
Esta es la configuración de resumen que actualmente se transfiere en exceso a ES5:
import { nodeResolve } from '@rollup/plugin-node-resolve'; import commonjs from '@rollup/plugin-commonjs'; import flow from 'rollup-plugin-flow'; export default [ { input: 'src/index.js', output: [ { file: 'dist/index.esm.js', format: 'esm', // ES2015 modules version so consumers can tree-shake }, ], plugins: [flow(), commonjs(), nodeResolve()], }, ];Incluso cuando elimino los ajustes preestablecidos, sigue haciendo exactamente lo mismo:
import babel from '@rollup/plugin-babel'; export default [ { input: 'src/index.js', output: [ { file: 'dist/index.esm.js', format: 'esm', // ES2015 modules version so consumers can tree-shake }, ], plugins: [ babel({ presets: [], }), ], }, ];¿Necesito cambiar algo en .babelrc? Actualmente es el siguiente:
{ "presets": [ [ "@babel/preset-env", { "targets": { "esmodules": true } } ], ["@babel/preset-flow"] ] }La biblioteca está aquí .
Hmm, creo que el problema era que .babelrc se estaba aplicando incluso en el caso de ESM. Entonces la respuesta es:
.babelrcrollup.config.jsrollup-esm.config.js para manejar explícitamente la sintaxis de clase.Rollup.config.js:
... plugins: [ flow(), commonjs(), nodeResolve(), babel({ babelHelpers: 'bundled', presets: [ [ '@babel/preset-env', { targets: { esmodules: true, }, }, ], ['@babel/preset-flow'], ], }), ],resumen-esm.config.js:
import babel from '@rollup/plugin-babel'; export default [ { input: 'src/index.js', output: [ { file: 'dist/index.esm.js', format: 'esm', // ES2015 modules version so consumers can tree-shake }, ], plugins: [ babel({ plugins: ['@babel/plugin-proposal-class-properties'], presets: ['@babel/preset-flow'], }), ], }, ];