Estoy tratando de crear 2 compilaciones separadas usando rollup.js : application.js y dependencies.js , que contienen el código de mi aplicación y el código de biblioteca común ( react , react-dom , etc.), respectivamente.
Los documentos dicen que debería poder simplemente usar externals: ['react', 'react-dom'] y hacer que funcione, pero cuando inspecciono el paquete resultante, termino teniendo el cuerpo completo de ambas librerías incluidas. Aquí está mi ejemplo app.config.js , al que llamo usando rollup -c app.config.js :
¿Qué estoy haciendo mal?
import babel from 'rollup-plugin-babel' import commonjs from 'rollup-plugin-commonjs' import nodeResolve from 'rollup-plugin-node-resolve' import replace from 'rollup-plugin-replace' import uglify from 'rollup-plugin-uglify' import { keys } from 'lodash' const PRODUCTION = (process.env.NODE_ENV || 'development') === 'production' const ENVIRONMENT = JSON.stringify(PRODUCTION ? 'production' : 'development') const EXTERNALS = { 'react': 'React', 'react-dom': 'ReactDOM', } const plugins = [ replace({ 'process.env.NODE_ENV': ENVIRONMENT }), babel({ babelrc: false, exclude: ['node_modules/**', '**/*.json'], presets: ['es2015-rollup', 'react'], }), commonjs({ ignoreGlobal: false, include: ['node_modules/**'], }), nodeResolve({ browser: true, jsnext: true, main: true, preferBuiltins: false, }), ] if (PRODUCTION) { plugins.push(uglify()) } export default { entry: 'source/application.js', exports: 'none', external: keys(EXTERNALS), globals: EXTERNALS, plugins, targets: [{ dest: 'build/js/application.js', format: 'iife', sourceMap: !PRODUCTION, sourceMapFile: '/js/application.js', }], treeshake: true, }La respuesta que encontré fue incluir un argumento adicional a la llamada del complemento rollup-plugin-node-resolve , de la siguiente manera:
nodeResolve({ ignoreGlobal: false, include: ['node_modules/**'], skip: keys(EXTERNALS), // <<-- skip: ['react', 'react-dom'] }), Aparentemente, esto es necesario, de modo que el rollup-plugin-node-resolve sepa skip la importación de estas dependencias externas cuando otras bibliotecas incluidas en node_modules las importen.
por ejemplo: import someReactLib from 'some-react-lib' que usa import React from 'react' . Sin el lenguaje de skip , esto parece resultar en la incorporación de React al paquete general.