使用带有Rollup的节点模块来构建Web客户端

Question

我正在尝试使用汇总而不是浏览器和babel来构建反应应用程序。我意识到我需要使用rollup-plugin-babel来转换jsx，但是当我告诉汇总格式为iife时，最终页面会加载错误：

Uncaught ReferenceError: React is not defined

我需要向rollup.config.js添加什么才能在我的最终版本中包含我在package.json中安装的节点模块？

Answer 1

两个选项：

1. 在您的应用包
之前将React包含为单独的<script>标记
2. 在配置文件中包含rollup-plugin-node-resolve，以从node_modules文件夹中提取依赖项。

如果采用第二条路线，您还需要rollup-plugin-commonjs（将CommonJS模块转换为ES模块）。我想你还需要为包含JSX的每个模块添加import * as React from 'react'，否则你将继续得到ReferenceError。

注意：您可以使用rollup-plugin-buble来转换JSX。它类似于Babel插件，但速度更快（尽管它没有转换每个ES2015功能）