Trying to setup a WebRtc connection in my new Svelte app, and am hitting this error whenever I try to import a library.
ReferenceError: buffer is not defined
Example Code: https://github.com/nickgrealy/svelte-webrtc (link also below)
Here are the steps to reproduce: install the library, then import it on a *.svelte component.
e.g. peerjs
npm i peerjs
import Peer from "peerjs";
also occurs for this library - simple-peer
npm i simple-peer
import Peer from "simple-peer";
Both give the following error:
Uncaught ReferenceError: buffer is not defined
at main.ts:14
Not really sure what to try next... writing vanilla Javascript? Try other libraries?
I don't know how to configure rollup... (hoping it's something simple that one of you have come across before!).
N.B. not sure if relevant, I converted the Svelte project to Typescript (using the inbuilt script).
** Added code to reproduce **
https://github.com/nickgrealy/svelte-webrtc/blob/main/src/main.ts#L2
Console logs from 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$$0$1')
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
** Update **
Added the node plugin, now getting this error...
Uncaught ReferenceError: require$$1$1 is not defined
... with these logs.
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$$1$1')
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~! 🚀
When using peerjs browserify is not required and change output format to cjs in rollup.config.js.
If you want to keep iife then you need to disable strict mode in rollup.config.js under output property strict: false because the library has some issue.
Related
I was trying to install jquery on my Angular project and after write some jquery dependency on package.json doc and type npm update, the console says Error: Module not found: Error: Can't resolve 'angular2-moment'.
Error occurs in the template of component RegisterComponent.
** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
× Failed to compile.
✔ Browser application bundle generation complete.
Initial Chunk Files | Names | Raw Size
main.js | main | 83.62 kB |
runtime.js | runtime | 6.51 kB |
4 unchanged chunks
Build at: 2023-01-10T02:39:00.432Z - Hash: 2a1b1b37176d6913 - Time: 536ms
./src/app/app.module.ts:7:0-47 - Error: Module not found: Error: Can't resolve 'angular2-moment' in 'C:\Users\xxxxxx\Desktop\Proyectos IT\registro_cintas\client\src\app'
Error: src/app/app.component.html:6:34 - error NG8002: Can't bind to 'routerLink' since it isn't a known property of 'a'.
6 <a class="link-home" [routerLink]="['/home']">
continue...
~~~~~~~~~~~~~~~~~~~~~~~~
I tryed installing ngx-moment, angular2-moment again or uninstalling this last one algo I erase the entire folder and made a git clone from the last working commit but nothing, I think the angular2-moment it's not compatible with my Angular version but I don't know what to do.
I have CodeDeploy pull code from my GitHub repo. In the deployment Commit ID (for GitHub) I have specified the Commit ID that I want to deploy. My repo has the following structure:
my-service/
README.md
.gitignore
scripts/
deploy.sh
src/
<lots of code here>
pm2.dev.json
appspec.yml
My appspec.yml file looks like:
version: 0.0
os: linux
files:
- source: /
destination: /home/ubuntu
hooks:
BeforeInstall:
- location: scripts/deploy.sh
timeout: 300
runas: root
My scripts/deploy.sh looks like:
sudo npm install pm2 -g
pwd
pm2 start /home/ubuntu/my-service/pm2.dev.json
When I run the CodeDeployment deployment for this, it fails with the following error:
Script at specified location: scripts/deploy.sh run as user root failed with exit code 1
When I look at the logs I see:
LifecycleEvent - BeforeInstall
Script - scripts/deploy.sh
[stderr]npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.
[stdout]changed 182 packages, and audited 183 packages in 8s
[stdout]
[stdout]12 packages are looking for funding
[stdout] run `npm fund` for details
[stdout]
[stdout]found 0 vulnerabilities
[stdout]/opt/codedeploy-agent
[stderr][PM2][ERROR] File /home/ubuntu/my-service/pm2.dev.json not found
Sure enough when I look in /home/ubuntu/my-service, I do not see a pm2.dev.json file, because this server had been manually configured several weeks ago before a pm2.dev.json file was added to the project. I would have expected CodeDeploy to have written whats in the repo to the server under /home/ubuntu.
Can anyone spot anything wrong with my appspec.yml or other configuration? Could it be a bad GitHub setup?
Had to change BeforeInstall to Install.
BeforeInstall runs before it copies over the source code (specified under files/source). But Install run just after that copy occurs, hence files will be available on the file system.
I am trying to white label this github repo.
https://github.com/RocketChat
Here is the white label guide that the RocketChat has provided.
https://developer.rocket.chat/mobile-app/mobile-app-white-labelling/ios-app-white-labelling
This library is for react native. I am facing this issue when I try to run the project.
The project is failing the build process with this error.
> PhaseScriptExecution Upload\ source\ maps\ to\ Bugsnag
> /Users/macbook/Library/Developer/Xcode/DerivedData/RocketChatRN-adkttzebukwzincfwduuaihsdgwi/Build/Intermediates.noindex/RocketChatRN.build/Debug-iphoneos/RocketChatRN.build/Script-88055964DAAE45B1A4886C27.sh
> (in target 'RocketChatRN' from project 'RocketChatRN')
> cd /Users/macbook/Rocket.Chat.ReactNative-develop/ios
> /bin/sh -c /Users/macbook/Library/Developer/Xcode/DerivedData/RocketChatRN-adkttzebukwzincfwduuaihsdgwi/Build/Intermediates.noindex/RocketChatRN.build/Debug-iphoneos/RocketChatRN.build/Script-88055964DAAE45B1A4886C27.sh
>
> ℹ Preparing upload of React Native source map (dev / ios) › Reading
> source map
> "/var/folders/sz/jj5jd6j54kd505vxsyxvlk1h0000gn/T//bcd7e9d7452d009ff844f5acf22fb2f3-main.jsbundle.map"
> › Reading bundle file
> "/Users/macbook/Library/Developer/Xcode/DerivedData/RocketChatRN-adkttzebukwzincfwduuaihsdgwi/Build/Products/Debug-iphoneos/main.jsbundle"
> ℹ Applying transformations to source map › Ensuring sourcesContent
> field is populated › Stripping project root from sources › Initiating
> upload to "https://upload.bugsnag.com/react-native-source-map"
ERROR The request timed out.
Connection timed out
at ClientRequest.<anonymous> (/Users/macbook/Rocket.Chat.ReactNative-develop/node_modules/#bugsnag/source-maps/dist/Request.js:190:21)
at Object.onceWrapper (node:events:641:28)
at ClientRequest.emit (node:events:527:28)
at TLSSocket.emitRequestTimeout (node:_http_client:771:9)
at Object.onceWrapper (node:events:641:28)
at TLSSocket.emit (node:events:539:35)
at TLSSocket.Socket._onTimeout (node:net:516:8)
at listOnTimeout (node:internal/timers:559:17)
at processTimers (node:internal/timers:502:7)
I have tried to remove the source map upload. See Screen Shot 1
It keeps on giving the same error still.
It says bugsnag source map failed to upload and is timing out. I have no prior experience with React Native and I am just trying to white label their code. So any help will be appreciated.
Would you be able to check your package.json file for which version of #bugsnag/source-maps you are using? If you are using anything prior to v2.3.0 of #bugsnag/source-maps you could try updating as it has now increased the default timeout and made some other improvements.
Try this, (M1 Mac only I guess)
Go to the target you want to archive
Build settings ---> Architectures ---> Excluded Architectures
Delete arm64
Also another possible reason could be that Xcode is using an outdated version of Node
By default, Xcode will use the Node binary located at /usr/local/bin/node. Check its version by running:
/usr/local/bin/node -v
node -v
If the first command outputs an older version of Node, simply delete it and replace it with a symlink to the newer one:
rm -rf /usr/local/bin/node
ln -s $(which node) /usr/local/bin/node
Solution
My HDD is formatted as exFat which doen'nt seem to support the readlink operation.
I am trying to set up a gatsby page via the gatsby CLI. The 'gatsby new' wokrs and set's up everything nicely, as far as I can tell. When it comes to starting the develop server I get the Error like in the title: "Error: EISDIR: illegal operation on a directory, readlink './path/on/my/hdd/.cache'
I learned, that "EISDIR means that the target of the operation is a directory in reality but that the expected filetype of the target is something other than a directory." (Using Node.js I get, "Error: EISDIR, read").
What drives me mad is, that a file called .cache wouldn't make much sense, so somewhere deep down in this gatsby jungle has to be something, that gets messed up.
I've tryed node Versions 10.16.0 and 12.2.0 managed via nvm on windows 10. I've tryed different Folders and Harddrives, I've force cleared my node cache, I've tryed different starter packages, I've tryed npm update on the node_modules installed via gatsby.
PS > gatsby develop
success open and validate gatsby-configs - 0.075 s
success load plugins - 9.615 s
success onPreInit - 0.003 s
success initialize cache - 0.074 s
ERROR
Unable to copy site files to .cache EISDIR: illegal operation on a directory, readlink 'C:\my-gatsby-website\.cache'
I did not change anything in app.scss, but when I run npm run watch I get the following errors:
error in ./resources/sass/app.scss
Module build failed (from ./node_modules/sass-loader/lib/loader.js):
Unsupported operation: Cannot extract a file path from a URI with a fragment component
# ./resources/sass/app.scss 2:14-254
Asset Size Chunks Chunk Names
/js/app.js 2.46 MiB /js/app [emitted] /js/app
ERROR in ./resources/sass/app.scss
Module build failed (from ./node_modules/css-loader/index.js):
ModuleBuildError: Module build failed (from ./node_modules/sass-loader/lib/loader.js):
undefined
^
Join(null, "variables"): part 0 was null, but part 1 was not.
#import 'variables';
^^^^^^^^^^^
stdin 2:9 root stylesheet
in C:\Users\TAQI VAHEED\Desktop\#Coding\resPro\resources\sass\app.scss (line 2, column 9)
at runLoaders (C:\Users\TAQI VAHEED\Desktop\#Coding\resPro\node_modules\webpack\lib\NormalModule.js:30
at C:\Users\TAQI VAHEED\Desktop\#Coding\resPro\node_modules\loader-runner\lib\LoaderRunner.js:364:11
at C:\Users\TAQI VAHEED\Desktop\#Coding\resPro\node_modules\loader-runner\lib\LoaderRunner.js:230:18
at context.callback (C:\Users\TAQI VAHEED\Desktop\#Coding\resPro\node_modules\loader-runner\lib\Loader
13)
Any help appreciated.
Finally found the issue. It is related to dart-sass being used instead of node-sass with laravel-mix v4.x.x.
Turns out something related to dart-sass or laravel-mix does not work well with paths containing a '#' symbol. In your case, your app is located at C:\Users\TAQI VAHEED\Desktop\#Coding\resPro and the #Coding folder is creating the error.
Either move your app somewhere else without a '#' symbol in the path OR enable node-sass again by following the steps from laravel-mix 4.0.0 release notes:
you can manually switch back to node-sass, like so:
npm install node-sass
mix.sass('resources/sass/app.sass', 'public/css', {
implementation: require('node-sass')
});
in your webpack.mix.js write the code
mix.js('resources/js/app.js', 'public/js')
.postCss('resources/css/app.css', 'public/css');