Svelte - ReferenceError: buffer is not defined
Svelte - ReferenceError: buffer is not defined
尝试在我的新 Svelte 应用程序中设置 WebRtc 连接,但每当我尝试导入库时都会遇到此错误。
ReferenceError: buffer is not defined
示例代码: https://github.com/nickgrealy/svelte-webrtc(下面还有link)
以下是重现的步骤:安装库,然后将其导入 *.svelte
组件。
例如peerjs
npm i peerjs
import Peer from "peerjs";
此库也会出现 - simple-peer
npm i simple-peer
import Peer from "simple-peer";
两者都给出以下错误:
Uncaught ReferenceError: buffer is not defined
at main.ts:14
不太确定接下来要尝试什么...写香草 Javascript?尝试其他库?
我不知道如何配置 rollup...(希望你们中的某个人以前遇到过这种简单的事情!)。
N.B。不确定是否相关,我将 Svelte 项目转换为 Typescript(使用内置脚本)。
** 添加了重现代码 **
https://github.com/nickgrealy/svelte-webrtc/blob/main/src/main.ts#L2
来自 yarn dev
的控制台日志
yarn run v1.22.10
$ rollup -c -w
rollup v2.56.3
bundles src/main.ts → public/build/bundle.js...
(!) Missing shims for Node.js built-ins
Creating a browser bundle that depends on "buffer" and "events". You might need to include https://github.com/snowpackjs/rollup-plugin-polyfill-node
LiveReload enabled
(!) Plugin node-resolve: preferring built-in module 'buffer' over local alternative at '/Users/userx/svelte-webrtc/node_modules/buffer/index.js', pass 'preferBuiltins: false' to disable this behavior or 'preferBuiltins: true' to disable this warning
(!) Circular dependencies
node_modules/readable-stream/lib/_stream_readable.js -> node_modules/readable-stream/lib/_stream_duplex.js -> node_modules/readable-stream/lib/_stream_readable.js
node_modules/readable-stream/lib/_stream_duplex.js -> node_modules/readable-stream/lib/_stream_writable.js -> node_modules/readable-stream/lib/_stream_duplex.js
node_modules/readable-stream/lib/_stream_duplex.js -> node_modules/readable-stream/lib/_stream_writable.js -> /Users/userx/svelte-webrtc/node_modules/readable-stream/lib/_stream_duplex.js?commonjs-proxy -> node_modules/readable-stream/lib/_stream_duplex.js
node_modules/readable-stream/lib/_stream_readable.js -> node_modules/readable-stream/lib/_stream_duplex.js -> /Users/userx/svelte-webrtc/node_modules/readable-stream/lib/_stream_readable.js?commonjs-proxy -> node_modules/readable-stream/lib/_stream_readable.js
(!) Missing global variable names
Use output.globals to specify browser global variable names corresponding to external modules
buffer (guessing 'buffer')
events (guessing 'require$[=13=]')
created public/build/bundle.js in 2.9s
[2021-09-05 00:31:10] waiting for changes...
> svelte-app@1.0.0 start
> sirv public --no-clear "--dev"
Your application is ready~!
- Local: http://localhost:5000
- Network: Add `--host` to expose
────────────────── LOGS ──────────────────
[00:31:18] 200 ─ 5.50ms ─ /
[00:31:18] 200 ─ 0.60ms ─ /global.css
[00:31:18] 200 ─ 0.71ms ─ /build/bundle.css
[00:31:18] 200 ─ 1.35ms ─ /build/bundle.js
[00:31:22] 200 ─ 0.76ms ─ /global.css
[00:31:22] 200 ─ 1.83ms ─ /build/bundle.css
[00:31:22] 200 ─ 3.96ms ─ /build/bundle.js.map
** 更新 **
添加了 node plugin,现在出现此错误...
Uncaught ReferenceError: require$ is not defined
...这些日志。
yarn run v1.22.4
$ rollup -c -w
rollup v2.56.3
bundles src/main.ts → public/build/bundle.js...
(!) Missing shims for Node.js built-ins
Creating a browser bundle that depends on "buffer". You might need to include https://github.com/snowpackjs/rollup-plugin-polyfill-node
LiveReload enabled
(!) Circular dependency
polyfill-node.global.js -> polyfill-node.global.js
(!) Missing global variable name
Use output.globals to specify browser global variable names corresponding to external modules
buffer (guessing 'require$')
created public/build/bundle.js in 2.6s
[2021-09-05 00:57:04] waiting for changes...
npm WARN lifecycle The node binary used for scripts is /var/folders/05/qnr367194ss7ktgg_c2r57440000gp/T/yarn--1630767421122-0.4620373266212361/node but npm is using /Users/userx/.nvm/versions/node/v14.17.3/bin/node itself. Use the `--scripts-prepend-node-path` option to include the path for the node binary npm was executed with.
> svelte-app@1.0.0 start /Users/userx/svelte-webrtc
> sirv public --no-clear "--dev"
Your application is ready~!
当不需要使用 peerjs
browserify
时,在 rollup.config.js
中将输出 format
更改为 cjs
。
如果你想保留 iife
那么你需要在输出 属性 strict: false
下的 rollup.config.js
中禁用 strict
模式,因为库有一些问题.
尝试在我的新 Svelte 应用程序中设置 WebRtc 连接,但每当我尝试导入库时都会遇到此错误。
ReferenceError: buffer is not defined
示例代码: https://github.com/nickgrealy/svelte-webrtc(下面还有link)
以下是重现的步骤:安装库,然后将其导入 *.svelte
组件。
例如peerjs
npm i peerjs
import Peer from "peerjs";
此库也会出现 - simple-peer
npm i simple-peer
import Peer from "simple-peer";
两者都给出以下错误:
Uncaught ReferenceError: buffer is not defined
at main.ts:14
不太确定接下来要尝试什么...写香草 Javascript?尝试其他库?
我不知道如何配置 rollup...(希望你们中的某个人以前遇到过这种简单的事情!)。
N.B。不确定是否相关,我将 Svelte 项目转换为 Typescript(使用内置脚本)。
** 添加了重现代码 **
https://github.com/nickgrealy/svelte-webrtc/blob/main/src/main.ts#L2
来自 yarn dev
yarn run v1.22.10
$ rollup -c -w
rollup v2.56.3
bundles src/main.ts → public/build/bundle.js...
(!) Missing shims for Node.js built-ins
Creating a browser bundle that depends on "buffer" and "events". You might need to include https://github.com/snowpackjs/rollup-plugin-polyfill-node
LiveReload enabled
(!) Plugin node-resolve: preferring built-in module 'buffer' over local alternative at '/Users/userx/svelte-webrtc/node_modules/buffer/index.js', pass 'preferBuiltins: false' to disable this behavior or 'preferBuiltins: true' to disable this warning
(!) Circular dependencies
node_modules/readable-stream/lib/_stream_readable.js -> node_modules/readable-stream/lib/_stream_duplex.js -> node_modules/readable-stream/lib/_stream_readable.js
node_modules/readable-stream/lib/_stream_duplex.js -> node_modules/readable-stream/lib/_stream_writable.js -> node_modules/readable-stream/lib/_stream_duplex.js
node_modules/readable-stream/lib/_stream_duplex.js -> node_modules/readable-stream/lib/_stream_writable.js -> /Users/userx/svelte-webrtc/node_modules/readable-stream/lib/_stream_duplex.js?commonjs-proxy -> node_modules/readable-stream/lib/_stream_duplex.js
node_modules/readable-stream/lib/_stream_readable.js -> node_modules/readable-stream/lib/_stream_duplex.js -> /Users/userx/svelte-webrtc/node_modules/readable-stream/lib/_stream_readable.js?commonjs-proxy -> node_modules/readable-stream/lib/_stream_readable.js
(!) Missing global variable names
Use output.globals to specify browser global variable names corresponding to external modules
buffer (guessing 'buffer')
events (guessing 'require$[=13=]')
created public/build/bundle.js in 2.9s
[2021-09-05 00:31:10] waiting for changes...
> svelte-app@1.0.0 start
> sirv public --no-clear "--dev"
Your application is ready~!
- Local: http://localhost:5000
- Network: Add `--host` to expose
────────────────── LOGS ──────────────────
[00:31:18] 200 ─ 5.50ms ─ /
[00:31:18] 200 ─ 0.60ms ─ /global.css
[00:31:18] 200 ─ 0.71ms ─ /build/bundle.css
[00:31:18] 200 ─ 1.35ms ─ /build/bundle.js
[00:31:22] 200 ─ 0.76ms ─ /global.css
[00:31:22] 200 ─ 1.83ms ─ /build/bundle.css
[00:31:22] 200 ─ 3.96ms ─ /build/bundle.js.map
** 更新 **
添加了 node plugin,现在出现此错误...
Uncaught ReferenceError: require$ is not defined
...这些日志。
yarn run v1.22.4
$ rollup -c -w
rollup v2.56.3
bundles src/main.ts → public/build/bundle.js...
(!) Missing shims for Node.js built-ins
Creating a browser bundle that depends on "buffer". You might need to include https://github.com/snowpackjs/rollup-plugin-polyfill-node
LiveReload enabled
(!) Circular dependency
polyfill-node.global.js -> polyfill-node.global.js
(!) Missing global variable name
Use output.globals to specify browser global variable names corresponding to external modules
buffer (guessing 'require$')
created public/build/bundle.js in 2.6s
[2021-09-05 00:57:04] waiting for changes...
npm WARN lifecycle The node binary used for scripts is /var/folders/05/qnr367194ss7ktgg_c2r57440000gp/T/yarn--1630767421122-0.4620373266212361/node but npm is using /Users/userx/.nvm/versions/node/v14.17.3/bin/node itself. Use the `--scripts-prepend-node-path` option to include the path for the node binary npm was executed with.
> svelte-app@1.0.0 start /Users/userx/svelte-webrtc
> sirv public --no-clear "--dev"
Your application is ready~!
当不需要使用 peerjs
browserify
时,在 rollup.config.js
中将输出 format
更改为 cjs
。
如果你想保留 iife
那么你需要在输出 属性 strict: false
下的 rollup.config.js
中禁用 strict
模式,因为库有一些问题.