我已将我的 ionic 应用程序从 beta 11 更新到 rc0。所以这意味着我已经从 Angular2 RC4 切换到 Angular2 stable，从 TypeScript 1.8 切换到 2，并使用 rollupjs 模块捆绑器。

我已经根据这篇博客文章配置了 AngularFire2： Ionic 2 RC0、Firebase 3 + AngularFire 2 入门

我无法编译并收到此错误：

rollup：强烈建议不要使用 ofeval（在 c:\XXX\node_modules\angularfire2\node_modules\firebase\firebase.js 中），因为它会带来安全风险，并可能导致缩小问题。 有关更多详细信息，请参阅 https://github.com/rollup/rollup/wiki/Troubleshooting#avoiding-eval

有人知道发生了什么事以及如何解决这个问题吗？

我有 2 个汇总配置文件，其中有一些常见部分和不常见部分：

 // rollup.config.umd.js
  export config {
     external: ['invariant', 'lodash'],
     globals: {
      invariant: 'invariant'
     },
     input: 'src/index.js',
     name: 'my.comp',
     output: {
       file: 'my.comp.umd.js'
       format: 'umd'
     }...

和另一个文件

 // rollup.config.esm5.js
  export config {
     external: ['invariant', 'lodash'],
     globals: {
      invariant: 'invariant'
     },
     input: 'src/index.js',
     name: 'my.comp',
     output: {
       file: 'my.comp.es5.js'
       format: 'es'
     }...

如何保持这些配置文件干燥？

不保持 DRY 会产生以下问题，例如想象一下许多外部依赖项 - 如果忘记在一个地方添加新的依赖项，我们就会遇到麻烦。

（我还使用了一些不同的插件集等和插件配置，但我说这超出了这个问题的范围。）

我正在尝试在我的 Sapper 应用程序中打开并读取 .md 文件的目录。我尝试导入，但它不允许字符串表达式（`file${index}.md`）。因此，我尝试通过 fs 节点模块打开并读取文件，但我在服务器中收到以下消息：

preferring built-in module 'fs' over local alternative at 'fs', pass 'preferBuiltins: false' to disable this behavior or 'preferBuiltins: true' to disable this warning\npreferring built-in module 'fs' over local alternative at 'fs', pass 'preferBuiltins: false' to disable this behavior or 'preferBuiltins: true' to disable this warning\n'fs' is imported by src/routes/blog/[slug].svelte, but could not be resolved \xe2\x80\x93 treating it as an external dependency\n'default' is imported from external module 'fs' but never used

我正在使用 svelte+rollup+rollup-plugin-polyfill

SCRIPT438：对象不支持“最接近”的属性或方法

即使我包括，仍然会发生

polyfill(['@webcomponents/webcomponentsjs','element-closest']),

在我的 rollup.js 中。

调用发生在这段代码中：

function onDocumentClick (e) {
    if (!e.target.closest('.autocomplete')) close();
}

为什么polyfill不存在？但是，如何正确使用它呢？我正在考虑将 .closest 替换为 IE11 支持之一。

我认为 commonjs 插件可以让您使用较旧的模块，但我无法让 rollup 与https://www.npmjs.com/package/create-hmac一起使用。这是一个较旧的模块，据我所知我需要使用：

const createHmac = require("create-hmac");

我无法使用导入。有什么方法可以将其与汇总一起使用，还是我运气不好？我正在使用标准的 Svelte rollup 模板，并尝试使用namedExports、dynamicRequireTargets、不同的 Resolve 设置等。如果任何真正了解 rollup 的人可以帮助我，我将不胜感激！

我正在尝试使用样式组件并在开发中拥有完整的类名。可以用babel-plugin-styled-components和 来完成displayName: true，但我的设置不起作用。

有谁知道我做错了什么？

谢谢

import { defineConfig } from 'vite';
import reactRefresh from '@vitejs/plugin-react-refresh';
import { babel } from '@rollup/plugin-babel';

export default defineConfig({
  plugins: [
    reactRefresh(),
    babel({
      exclude: 'node_modules/**',
      presets: ['@babel/preset-env', '@babel/preset-react'],
      plugins: [
        ['babel-plugin-styled-components', { displayName: true }]
      ],
    }),
  ],
});

版本

"@babel/preset-env": "^7.14.9",
"@babel/preset-react": "^7.14.5",
"@rollup/plugin-babel": "^5.3.0",
"babel-plugin-styled-components": "^1.13.2",
"styled-components": "^5.3.0"
"vite": "^2.4.4",

我正在尝试在 React 中构建一个组件库，并使用 Rollup 来捆绑东西。这是我第一次使用它，我看了几个教程并遵循了他们的设置（像这样）。这是我的rollup.config.js文件：

import resolve from "@rollup/plugin-node-resolve";
import commonjs from "@rollup/plugin-commonjs";
import typescript from "@rollup/plugin-typescript";
import dts from "rollup-plugin-dts";

const packageJson = require("./package.json");

export default [
    {
        input: "src/index.ts",
        output: [
            {
                file: packageJson.main, //CommonJS
                format: "cjs",
                sourcemap: true,
            },
            {
                file: packageJson.module, //ES6
                format: "esm",
                sourcemap: true, 
            }
        ],
        plugins: [
            resolve(),
            commonjs(),
            typescript({ tsconfig: "./tsconfig.json" }),
        ]
    },
    {
        input: "dist/esm/types/index.d.ts",
        output: [{ file: "dist/index.d.ts", format: "esm" }],
        plugins: [dts()],
    }
]; …

背景：

我有一个带有两个包的纱线工作区的 lerna monorepo。我使用 rollup 作为打包器。

包/模块1/package.json：

{
  scripts: {
    "watch": "rollup -c rollup.config.js --watch",
    "build": "NODE_ENV=production && rollup -c rollup.config.js"
  }
}

包/module2/package.json：

{
  scripts: {
    "watch": "rollup -c rollup.config.js --watch",
    "build": "NODE_ENV=production && rollup -c rollup.config.js"
  }
}

预期行为：

1. lerna run build将为build每个包运行脚本。
2. lerna run watch将以watch监视模式运行每个包的脚本。

当前行为：

1. lerna run build按预期工作。该build脚本对这两个包都可以正常运行。
2. lerna run watch 只是挂在那里：

lerna notice cli v3.13.1
lerna info Executing command in 2 packages: "yarn run watch"
[[just hangs …

我已经创建了一个 React 库rollup，但是，我有大量的组件被导出，因此文件大小相对较大。

所以在我导入库的项目中执行以下操作；

import { ComponentExampleOne, ComponentExampleTwo } from 'my-react-library';

它导入通过汇总输出的整个索引文件（包括所有其他组件和任何 3rd 方依赖项），因此当用户第一次点击上面导入的页面时，他们需要下载整个文件，这比我想要的要大得多它是。

对于lodash我只想访问单个函数而不是整个库的情况，我会执行以下操作；

import isEmpty from 'lodash/isEmpty';

我想通过 rollup 实现类似的功能，这样我就可以做类似的事情

import { ComponentExampleOne } from 'my-react-library/examples';
import { ButtonRed } from 'my-react-library/buttons';

所以我只导入index.js文件中导出的内容examples和buttons文件夹，这是我在库中的文件夹结构。

my-react-library/
-src/
--index.js
--examples/
---ComponentExampleOne.js
---ComponentExampleTwo.js
---ComponentExampleThree.js
---index.js
--buttons/
---ButtonRed.js
---ButtonGreen.js
---ButtonBlue.js
---index.js

我不知道通过汇总来实现这一目标？

这是我的当前 rollup.config.js

import babel from 'rollup-plugin-babel';
import peerDepsExternal from 'rollup-plugin-peer-deps-external';
import resolve from 'rollup-plugin-node-resolve';
import commonjs from 'rollup-plugin-commonjs';
import postcss from …

配置

  {\n    input: ['src/index.js', 'src/module1/index.js', 'src/module2/index.js'],\n    output: {\n      dir: 'dist',\n      format: 'es'\n    }\n  }\n

结构

\xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 dist\n\xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 index.js\n\xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 index2.js\n\xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 index3.js\n\xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 rollup.config.js\n\xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 src\n    \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 index.js\n    \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 module1\n    \xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 foo.js\n    \xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 index.js\n    \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 module2\n        \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 bar.js\n        \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 index.js\n

期望输出是这样的

\xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 dist\n\xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 libname.js\n\xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 module\n\xe2\x94\x82\xc2\xa0\xc2\xa0     \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 module1.js\n\xe2\x94\x82\xc2\xa0\xc2\xa0     \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 module2.js\n

有什么选项或插件可以提供帮助吗？多谢！

我在创建 vite 应用程序后运行服务器时遇到错误，请帮助我解决此问题。

我正在学习 Threejs，刚刚创建了一个使用 vanilla 框架和 javascript 作为语言的 vite 应用程序，一切都很顺利，但 npm run dev 显示了我似乎无法解决的错误。

我尝试在删除后安装 .json 文件，但仍然不行。