外部依赖项错误地捆绑在 rollup.js 中?

Posted

技术标签:

【中文标题】外部依赖项错误地捆绑在 rollup.js 中?【英文标题】:External dependencies are incorrectly bundled in rollup.js? 【发布时间】:2017-05-16 20:56:29 【问题描述】:

我正在尝试使用 rollup.js 创建 2 个单独的构建:application.jsdependencies.js,分别包含我的应用程序代码和公共库代码(reactreact-dom 等)。

文档说我应该能够简单地使用 externals: ['react', 'react-dom'] 并让它工作 - 但是当我检查生成的包时,我仍然最终包含了两个库的完整主体。这是我的示例app.config.js,我使用rollup -c app.config.js 调用它:

我做错了什么?

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,

【问题讨论】:

尝试使用 webpack.. 我发现它更容易 【参考方案1】:

我找到的答案是在 rollup-plugin-node-resolve 插件调用中包含一个附加参数,如下所示:

nodeResolve(
  ignoreGlobal: false,
  include: ['node_modules/**'],
  skip: keys(EXTERNALS), // <<-- skip: ['react', 'react-dom']
),

这显然是需要的,以便rollup-plugin-node-resolve 插件知道skip 导入这些外部依赖项,而其他node_modules 包含的库导入它们。

例如:import someReactLib from 'some-react-lib' 使用 import React from 'react'。如果没有 skip 语言,这似乎会导致将 React 拉入整个捆绑包。

【讨论】:

这是相当晦涩的默认行为,您是否发现在某处有文档记录?能给个链接吗? 看起来这不再起作用了,即使在添加了主要的汇总外部组件之后,我仍然看到一个包被错误地捆绑...非常令人沮丧。

以上是关于外部依赖项错误地捆绑在 rollup.js 中?的主要内容,如果未能解决你的问题,请参考以下文章

Rollup.js 未解决的依赖项

Rollup.js 没有捆绑我的 React 组件库字体

使用 Electron 应用程序有效地捆绑依赖项以进行分发

Maven项目已建立,但是在IntelliJ IDEA中似乎没有依赖项

捆绑为 UMD 的 React 组件在通过另一个 React 应用程序中的脚本标签导入时无法加载依赖项

包括外部 jar 依赖项 spring boot 测试