open-source-labs / sveltestorm Goto Github PK

SvelteStorm is an open-source IDE with a built-in Debugging window for viewing and debugging your Svelte project in real-time

License: MIT License

CSS 17.07% JavaScript 28.10% HTML 5.71% Svelte 44.23% TypeScript 4.88%

svelte3 electron nodejs developer-tools codemirror-editor xterm svelte

sveltestorm's Introduction

SvelteStorm 5.0

New Features and Improvements
How To Use SvelteStorm
Installing SvelteStorm 5 for the Purpose of Enhancing SvelteStorm as an IDE
- macOS
- Windows (using WSL 2)
Key Features
Authors
Previous Authors
Contributing
- Project

SvelteStorm

A Svelte IDE like no other. Embrace the storm. SvelteStorm is an open-source integrated developer environment (IDE) specifically tailored to provide essential tools a Svelte developer needs to build a Svelte application. With the new and improved SvelteStorm 5.0, we've improved the developer experience with performance metrics, split view, search, and linting, in addition to the existing code editor, terminal environment, file directory, browser view, developer tools, and component state viewer. SvelteStorm is built using Svelte and Electron and is downloadable for Windows and Mac operating systems.

New Features and Improvements

App Performance Metrics
Split View
Search
Linting
Quality of Life changes

How To Use SvelteStorm

Click on the 'File' menu button (CTRL+F or CMD+F will also work) in the top-left corner, then open a file or folder to begin editing.
When a Svelte project is opened, the File Directory populates with all of the files in that directory. From here, files can be opened, edited, and saved.
To use the browser window, start your project (i.e run 'npm start') and a new browser window will open up to the local port the project is running on.
To search through open files, CMD+F while in the editor window.
To gather App Performance metrics:
- Start the application with the command 'npm run performanceSS'.
- Click on the 'Performance Dash' button on the top right of the application to view the dashboard,
- Interact with the application - the dashboard will update automatically. Some of the web vitals will populate once the app is closed.
- Click 'back' at the bottom of the window to exit the dashboard.
To enable Split View, click the 'Split View' button on the top right of the application. Click 'back' at the bottom of the window to exit the dashboard.
To use the Time Travel Debugging feature:
- Run the command 'npm run sdebug' and a browser window will open with the project. Additionally, the Time Travel Debugging window will generate an initial snapshot of the project as well as a d3.js component hierarchy tree of the application. Any action on the browser window that creates a state change in your application will generate a new snapshot and update the d3.js tree.
- To view previous snapshots, click on any Snapshot button and cards containing each component's state at the time of the snapshot will appear. Application state changes are reflected in the browser window as you navigate between Snapshots - this allows for viewing of state changes based on different events.
Developer Tools are accessible via the 'Help' button in the top menu, or by using CTRL+D
For more information, click on SvelteStorm's Website via the 'Help' button for VSCode users the link below can provide insight to potential installation issues: #57

Installing SvelteStorm 5 for the Purpose of Enhancing SvelteStorm as an IDE

macOS

If using Node Version Manager (nvm) enter the following commands to help ensure a smooth installation: Install node version 16.16.0
- nvm install 16.16.0
- nvm use 16.16.0
- nvm alias default 16.16.0
Clone this SvelteStorm 5.0 repo to your code editor of choice (VS Code works best)
Run npm install to install dependencies
Run npm start and SvelteStorm will open up and be ready for use!

Windows

Do Not attempt to use anything related to WSL.

Install all of the latest Windows Updates (including the optional ones)
Install the latest PowerShell (version 7.2.6 as of this writing)
- Link to PowerShell Installation
Install Microsoft Visual Studio
- Note: This IS NOT Visual Studio Code … Just plain Visual Studio
- As of this writing 17.3.4
- Link to Visual Studio
- When prompted for modules to include, select the following:
  - Python development
  - Node.js development
  - Desktop development with C++
Install Node Version Manager (nvm) for Windows ([a walkthru is available on GeeksforGeeks])(https://www.geeksforgeeks.org/how-to-install-and-use-nvm-on-windows/)
- Using nvm enter the following commands to install Nodejs version 16.16.0
  - nvm install 16.16.0
  - nvm use 16.16.0
Clone this repo to your code editor of choice (VS Code works best)
Run npm install to install dependencies
Run npm start and SvelteStorm will open up and be ready for use!
Install the latest version of git
- Git Installation Link
Now Install Visual Studio Code
- VS Code Installation Link
Install the following VS Code Extensions:
- Remote Development
  - Remote WSL
  - Remote SSH
  - Remote Containers
- CMake Tools
- C/C++ Extension Pack
Clone this SvelteStorm 5.0 repo to your code editor of choice (VS Code works best)
Run npm install to install dependencies
Run npm start and SvelteStorm will open up and be ready for use!

Key Features

(NEW!) App Performance Dashboard - gain insights into your Svelte application such as the number of times different components are rendered and web vitals.
(NEW!) File Search - search through open files in the code editor.
(NEW!) Split View - view two files at once.
(NEW!) Javascript and HTML Linting - quickly find and fix syntax errors and warnings.
Time Travel Debugging Dev Tool
Real Time d3.js Component Hierarchy Visualization
Upgraded Browser Window
Updated Terminal. Built using XTerm
Tooltips Bar on Mouse Hover
Access to Svelte Documentation with a Single Click
Responsive Window Resizing
Tab Management Functionality Added
A Clean & Bold Theme Style
A code editor utilizing the “Dracula” dark-mode theme with syntax highlighting and bracket pair identification. Built using Code Mirror.
A fully functional terminal environment to navigate file systems and run code
A browser window for developers to see what their projects look like on the client end
A functioning file directory where users can open files and navigate folders to edit within the code editor

Authors

Mahmoud Albadawi | Kiran Banger | Leilani Hernandez | Javi Orozco |

Previous Authors

Contributing

There are many ways in which you can participate in this project, for example:

Check for known issues that you may be able to provide input on
Submit bugs and feature requests, and help us verify as they are checked in
Review source code changes
Review the documentation and make pull requests for anything from typos to additional and new content

This application uses Open Source components. You can find the source code of their open source projects along with license information below. We acknowledge and are grateful to these developers for their contributions to open source.

Project:

License (MIT) https://github.com/oslabs-beta/DeLorean/blob/main/LICENSE'

sveltestorm's People

Contributors

Stargazers

Watchers

Forkers

samfilip svrchi nestar6 ayemmoe frankstepanski amustafiz 3ld3st honsa kokizzu jonlinnell sarvex pseudobobsmith tedcraig farazmoallemi suryatmodulus eric-mulhern rodrigoieh rockystevejobs tedtaemin codebycandlelight keflynn ellipse120 ti-rudin askmetoo eastergit wangzhengbo dut3062796s ebernard2 kayodebristol heatherbarney zahidhasanaunto elenizoump baohnguyen95 aramkrakirian millerj20 skahrobaei swethakunda aral seanwallawalla-forks seanpm2001 paulweezydesignstudio caycodes rcervant paulweezydesign avarun42 smk53664 sateeven rankind94 k-sato1995 lguzzon-scratchbook jayruizjr ejhagen julianswkang carlyyarnell swierkopa tbarry16 iamnurbek coltonro zachradf realandygithub yakupc55 mike-villamor-git jsjedi mamertofabian karenc810 anestor6 obsecurus hirsutejim elliottburr timscodebase codedenma brightrhino cpmander davidjakubiec jeffreywentworth yuvalrs alexlaw528 jhpaige pgrich nickjenkins83 davehauser matthewmpan mcphail-alex jakejurado interim17 brianhip jennifernedland anima-os-dev enmk glistenstar waynemorganuk captainmor jackson2tall npark009 risiscafford jaysalgado jon19200 ryansun222 jake-up-0517 liliannemueller

sveltestorm's Issues

Screenshot

I think a screenshot in README could add a bit of spice to the repository. I want to try it but I also want to see what it looks like before trying it.

"a picture is worth a thousand words"

DEB installation: Theme parsing error, does not run

Installation via .DEB is ok, but, on my machine:

No shortcuts or .desktop launchers are created, it is very important to do so.
Running sveltestorm-v2.0 via a terminal cause a loop, and does not start:

Install via NPM does run, but hey it's not cooked yet.. wow

Naming confusion

I just read about "SvelteStorm", nice initiative!

I have to say I was confused at first: based on the name I expected "SvelteStorm" to be the Svelte variant of IDE's of Jetbrains (they have "WebStorm" and "PhpStorm" amonst others, language specific variations of the same IDE).

I think it would be good to not have this confusion. People will have certain expectations because of this, and mismatching expectations will give frustrations and confusion. Please consider renaming this IDE.

Apple Silicon support

Describe the bug

Not working npm install on MacBook with M1 chip. Is there a reason to use Electron v8? Electron >= v11 has separate arm64 build.

Logs

npm ERR! code 1
npm ERR! path /Users/nebula/Git/SvelteStorm/node_modules/electron-chromedriver
npm ERR! command failed
npm ERR! command sh -c node ./download-chromedriver.js
npm ERR! /Users/nebula/Git/SvelteStorm/node_modules/electron-chromedriver/download-chromedriver.js:19
npm ERR!   if (err != null) throw err
npm ERR!                    ^
npm ERR! 
npm ERR! Error: Failed to find Electron v8.0.0 for darwin-arm64 at https://github.com/electron/electron/releases/download/v8.0.0/chromedriver-v8.0.0-darwin-arm64.zip
npm ERR!     at Request.<anonymous> (/Users/nebula/Git/SvelteStorm/node_modules/nugget/index.js:169:61)
npm ERR!     at Request.emit (node:events:394:28)
npm ERR!     at Request.onRequestResponse (/Users/nebula/Git/SvelteStorm/node_modules/request/request.js:1059:10)
npm ERR!     at ClientRequest.emit (node:events:394:28)
npm ERR!     at HTTPParser.parserOnIncomingClient [as onIncoming] (node:_http_client:621:27)
npm ERR!     at HTTPParser.parserOnHeadersComplete (node:_http_common:127:17)
npm ERR!     at TLSSocket.socketOnData (node:_http_client:487:22)
npm ERR!     at TLSSocket.emit (node:events:394:28)
npm ERR!     at addChunk (node:internal/streams/readable:312:12)
npm ERR!     at readableAddChunk (node:internal/streams/readable:287:9)

update installation instructions

I just checked out the repo, and got the following error on npm i

npm i log

D:\Privat\SvelteStorm>npm i
npm WARN deprecated [email protected]: Please see https://github.com/lydell/urix#deprecated
npm WARN deprecated [email protected]: https://github.com/lydell/resolve-url#deprecated
npm WARN deprecated [email protected]: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
npm WARN deprecated [email protected]: This package has been deprecated and is no longer maintained. Please use @rollup/plugin-babel.
npm WARN deprecated [email protected]: this library is no longer supported
npm WARN deprecated [email protected]: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
npm WARN deprecated [email protected]: request has been deprecated, see https://github.com/request/request/issues/3142
npm WARN deprecated [email protected]: Please upgrade to @mapbox/node-pre-gyp: the non-scoped node-pre-gyp package is deprecated and only the @mapbox scoped package will recieve updates in the future
npm WARN deprecated [email protected]: This module has been deprecated and is no longer maintained. Please use @rollup/plugin-json.
npm WARN deprecated [email protected]: This module has moved and is now available at @rollup/plugin-replace. Please update your dependencies. This version is no longer maintained.
npm WARN deprecated [email protected]: In 6.x, the babel package has been deprecated in favor of babel-cli. Check https://opencollective.com/babel to support the Babel maintainers
npm WARN deprecated [email protected]: outdated version, please use @next
npm WARN deprecated [email protected]: core-js@<3.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js.
npm ERR! code 1
npm ERR! path D:\Privat\SvelteStorm\node_modules\node-pty
npm ERR! command failed
npm ERR! command C:\WINDOWS\system32\cmd.exe /d /s /c node scripts/install.js
npm ERR! gyp info it worked if it ends with ok
npm ERR! gyp info using [email protected]
npm ERR! gyp info using [email protected] | win32 | x64
npm ERR! gyp info find Python using Python version 3.9.5 found at "C:\Users\mserret\AppData\Local\Programs\Python\Python39\python.exe"
npm ERR! gyp http GET https://nodejs.org/download/release/v16.2.0/node-v16.2.0-headers.tar.gz
npm ERR! gyp http 200 https://nodejs.org/download/release/v16.2.0/node-v16.2.0-headers.tar.gz
npm ERR! gyp http GET https://nodejs.org/download/release/v16.2.0/SHASUMS256.txt
npm ERR! gyp http GET https://nodejs.org/download/release/v16.2.0/win-x86/node.lib
npm ERR! gyp http GET https://nodejs.org/download/release/v16.2.0/win-x64/node.lib
npm ERR! gyp http GET https://nodejs.org/download/release/v16.2.0/win-arm64/node.lib
npm ERR! gyp http 200 https://nodejs.org/download/release/v16.2.0/SHASUMS256.txt
npm ERR! gyp http 200 https://nodejs.org/download/release/v16.2.0/win-x64/node.lib
npm ERR! gyp http 200 https://nodejs.org/download/release/v16.2.0/win-x86/node.lib
npm ERR! gyp http 404 https://nodejs.org/download/release/v16.2.0/win-arm64/node.lib
npm ERR! gyp ERR! find VS
npm ERR! gyp ERR! find VS msvs_version not set from command line or npm config
npm ERR! gyp ERR! find VS VCINSTALLDIR not set, not running in VS Command Prompt
npm ERR! gyp ERR! find VS unknown version "undefined" found at "C:\Program Files\Microsoft Visual Studio\2022\Preview"
npm ERR! gyp ERR! find VS checking VS2019 (16.9.31205.134) found at:
npm ERR! gyp ERR! find VS "C:\Program Files (x86)\Microsoft Visual Studio\2019\Enterprise"
npm ERR! gyp ERR! find VS - "Visual Studio C++ core features" missing
npm ERR! gyp ERR! find VS could not find a version of Visual Studio 2017 or newer to use
npm ERR! gyp ERR! find VS looking for Visual Studio 2015
npm ERR! gyp ERR! find VS - not found
npm ERR! gyp ERR! find VS not looking for VS2013 as it is only supported up to Node.js 8
npm ERR! gyp ERR! find VS
npm ERR! gyp ERR! find VS **************************************************************
npm ERR! gyp ERR! find VS You need to install the latest version of Visual Studio
npm ERR! gyp ERR! find VS including the "Desktop development with C++" workload.
npm ERR! gyp ERR! find VS For more information consult the documentation at:
npm ERR! gyp ERR! find VS https://github.com/nodejs/node-gyp#on-windows
npm ERR! gyp ERR! find VS **************************************************************
npm ERR! gyp ERR! find VS
npm ERR! gyp ERR! configure error
npm ERR! gyp ERR! stack Error: Could not find any Visual Studio installation to use
npm ERR! gyp ERR! stack     at VisualStudioFinder.fail (D:\Privat\SvelteStorm\node_modules\node-gyp\lib\find-visualstudio.js:121:47)
npm ERR! gyp ERR! stack     at D:\Privat\SvelteStorm\node_modules\node-gyp\lib\find-visualstudio.js:74:16
npm ERR! gyp ERR! stack     at VisualStudioFinder.findVisualStudio2013 (D:\Privat\SvelteStorm\node_modules\node-gyp\lib\find-visualstudio.js:351:14)
npm ERR! gyp ERR! stack     at D:\Privat\SvelteStorm\node_modules\node-gyp\lib\find-visualstudio.js:70:14
npm ERR! gyp ERR! stack     at D:\Privat\SvelteStorm\node_modules\node-gyp\lib\find-visualstudio.js:372:16
npm ERR! gyp ERR! stack     at D:\Privat\SvelteStorm\node_modules\node-gyp\lib\util.js:54:7
npm ERR! gyp ERR! stack     at D:\Privat\SvelteStorm\node_modules\node-gyp\lib\util.js:33:16
npm ERR! gyp ERR! stack     at ChildProcess.exithandler (node:child_process:333:5)
npm ERR! gyp ERR! stack     at ChildProcess.emit (node:events:365:28)
npm ERR! gyp ERR! stack     at maybeClose (node:internal/child_process:1067:16)
npm ERR! gyp ERR! System Windows_NT 10.0.19042
npm ERR! gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "D:\\Privat\\SvelteStorm\\node_modules\\node-gyp\\bin\\node-gyp.js" "rebuild"
npm ERR! gyp ERR! cwd D:\Privat\SvelteStorm\node_modules\node-pty
npm ERR! gyp ERR! node -v v16.2.0
npm ERR! gyp ERR! node-gyp -v v7.1.2
npm ERR! gyp ERR! not ok

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\mserret\AppData\Local\npm-cache\_logs\2021-07-20T08_33_54_179Z-debug.log

So apparently there are some dependencies that need to be setup before running npm i. Especially some VS stuff, that i don't want to have on my compiter :D

Suggestion:
Add those details to the Readme.

Pretty cool.

So, I as creating this rough interface for testing out my blog intake.
copious-blog-entries

And, I was using Electron at first. But, I ran into a version problem. For instance, it was not obvious how to use fs/promises from node.js. But, then I tried NW.js and things got really smooth. I like the way the code is partitioned better to. Getting the debugger up in a separate window is nice, too. But, with NW, if you restart your app window, the debugger starts over as well. So, that's something they could fix. But, I was dead in the water with Electron, so I am living with it.

But, it would be great to have an IDE, especially one that does not impose some fat stack of components on a project and also allows use of vanilla JS when and where it is wanted.

Do you guys think you can make something like LiveCode?

I also have nascent tools in my alpha-copious repository for selecting code to into templates. Later the templates are populated with page specific code.

So, the work flow is supposed to go like this:
basic universal code -> select which part of that rides with a page -> generate to templates and modules -> template to an actual indexed page ... (with inserted html snippets and controls to initiate lazy loading of other components, which may as well be vanilla js and HTML as anything - but making a nice control over components such as Svelte components would be nice.)

So, some of this has to do with getting pages up with just enough code, with lazy loading of components onto a page as a user makes selections. That there is cached JS in modules or separate files is not to be ignored. But, my thoughts are that a page should not depend on preexisting assets in a browser and will load more weighty ones as the user gets more interested and involved with a page. Later, if the assets are there and the user comes back to it, then great - the speed up is good. Of course, there is version caching - a consistent mess. And, finally JS should WASM up easily with good use of service workers and IndexDB and other user located data state storage.

git checkout warning: case-insensitive paths collided

Checkout the repo on windows, and you will get something like the following output. But its just a warning, so its probably fine for the moment

Is there a way to store snapshots of my application for usage in a later session or do snapshots get deleted permanently when the IDE is closed?

npm start error

When I run npm start get :

D:\SVELTE\SvelteStorm-main>npm start

[email protected] start D:\SVELTE\SvelteStorm-main
concurrently "npm:svelte-dev" "electron-forge start"

[svelte-dev]
[svelte-dev] > [email protected] svelte-dev D:\SVELTE\SvelteStorm-main
[svelte-dev] > rollup -c -w
[svelte-dev]
[1] - Checking your system
[svelte-dev] rollup v2.53.2
[svelte-dev] bundles src/svelte.js → public...
[1] √ Checking your system
[1] - Locating Application
[1] √ Locating Application
[1] - Preparing native dependencies
[1] √ Preparing native dependencies
[1] - Launching Application
[1] √ Launching Application
[1]
[1] App threw an error during load
[1] Error: Cannot find module 'node-pty'
[1] Require stack:
[1] - D:\SVELTE\SvelteStorm-main\src\index.js
[1] - D:\SVELTE\SvelteStorm-main\node_modules\electron\dist\resources\default_app.asar\main.js
[1] -
[1] at Module._resolveFilename (internal/modules/cjs/loader.js:798:15)
[1] at Function../lib/common/reset-search-paths.ts.Module._resolveFilename (electron/js2c/browser_init.js:7718:16)
[1] at Module._load (internal/modules/cjs/loader.js:691:27)
[1] at Function.Module._load (electron/js2c/asar.js:748:26)
[1] at Module.require (internal/modules/cjs/loader.js:853:19)
[1] at require (internal/modules/cjs/helpers.js:74:18)
[1] at Object. (D:\SVELTE\SvelteStorm-main\src\index.js:6:13)
[1] at Module._compile (internal/modules/cjs/loader.js:968:30)
[1] at Object.Module._extensions..js (internal/modules/cjs/loader.js:986:10)
[1] at Module.load (internal/modules/cjs/loader.js:816:32)
[svelte-dev] A plugin is directly adding properties to the bundle object in the "generateBundle" hook. This is deprecated and will be removed in a future Rollup version, please use "this.emitFile" instead.
[svelte-dev] created public in 15.4s

File Directory only populates when opening a folder and not an individual file

Need to integrate monaco editor functions directly to file directory store

Bump electron and spectron to newer versions to remove vulnerabilities

Application breaks when attempting to update past Electron 8/Spectron 10.0.0 yet these versions have vulnerabilities.

[question] WSL support

Is there any way to get this working under WSL2 ?
Could you explain or give any links explaining the underlying problems etc ?

nom install error

When I run npm install I get :

daslicht@Marcs-Mac-mini SvelteStorm % npm install
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/monaco-editor
npm ERR!   monaco-editor@"^0.23.0" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer monaco-editor@"0.21.2" from [email protected]
npm ERR! node_modules/rollup-plugin-monaco-editor
npm ERR!   rollup-plugin-monaco-editor@"0.0.7" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR! 
npm ERR! See /Users/daslicht/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/daslicht/.npm/_logs/2021-07-17T11_06_07_372Z-debug.log
daslicht@Marcs-Mac-mini SvelteStorm %

61 error code ERESOLVE
62 error ERESOLVE unable to resolve dependency tree
63 error
64 error While resolving: [email protected]
64 error Found: [email protected]
64 error node_modules/monaco-editor
64 error   monaco-editor@"^0.23.0" from the root project
64 error
64 error Could not resolve dependency:
64 error peer monaco-editor@"0.21.2" from [email protected]
64 error node_modules/rollup-plugin-monaco-editor
64 error   rollup-plugin-monaco-editor@"0.0.7" from the root project
64 error
64 error Fix the upstream dependency conflict, or retry
64 error this command with --force, or --legacy-peer-deps
64 error to accept an incorrect (and potentially broken) dependency resolution.
64 error

~ Marc

~/projects/SvelteStorm-main $ npm install
npm WARN deprecated [email protected]: In 6.x, the babel package has been deprecated in favor of babel-cli. Check https://opencollective.com/babel to support the Babel maintainers
npm WARN deprecated [email protected]: This package has been deprecated and is no longer maintained. Please use @rollup/plugin-babel.
npm WARN deprecated [email protected]: This module has been deprecated and is no longer maintained. Please use @rollup/plugin-json.
npm WARN deprecated [email protected]: This module has moved and is now available at @rollup/plugin-replace. Please update your dependencies. This version is no longer maintained.
npm WARN deprecated [email protected]: request has been deprecated, see request/request#3142
npm WARN deprecated [email protected]: outdated version, please use @next
npm WARN deprecated [email protected]: this library is no longer supported
npm WARN deprecated [email protected]: Please upgrade to version 7 or higher. Older versions may use Math.random() in certain circumstances, which is known to be problematic. See https://v8.dev/blog/math-random for details.
npm WARN deprecated [email protected]: core-js@<3.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js.
npm WARN deprecated [email protected]: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
npm WARN deprecated [email protected]: Please upgrade to @mapbox/node-pre-gyp: the non-scoped node-pre-gyp package is deprecated and only the @mapbox scoped package will recieve updates in the future
npm WARN deprecated [email protected]: Please see https://github.com/lydell/urix#deprecated
npm WARN deprecated [email protected]: https://github.com/lydell/resolve-url#deprecated

Thanks, Ian