fredkschott / create-snowpack-app Goto Github PK
View Code? Open in Web Editor NEWThe all-in-one app template for Snowpack. [moved]
Home Page: https://www.snowpack.dev
License: Other
The all-in-one app template for Snowpack. [moved]
Home Page: https://www.snowpack.dev
License: Other
Hi.
I would like to see react-error-overlay during development. It will increase DX and make convenient migration from CRA
attempted to follow instructions to use svelte template
npx/npm 6.14.4
node 14.2.0, 13.14.0
npx create-snowpack-app myfolder --template @snowpack/app-template-svelte
create-snowpack-app 0.2.5
(Use `node --trace-warnings ...` to show where the warning was created)
(node:55107) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:55107) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
Hello,
Steps to reproduce:
In a fresh folder.
yarn add -D snowpack@next
[email protected]
installed
npx create-snowpack-app my-project-blank --template @snowpack/app-template-blank --use-yarn
npx snowpack build --bundle
cd build && npx http-server
Confetti pop on the screen but there is an error into the dev console:
Thanks,
Env: mac mojave | node v11.15.0
I just wanted to try snowpack for the first time and I chose the react template
npx create-snowpack-app prep-snowpack --template @snowpack/app-template-react
and I got this error
⠸ snowpack installing... https://cdn.pika.dev/-/[email protected]/dist=es2019/csz.js
✘ /prep-snowpack/node_modules/react/cjs/react.production.min.js?commonjs-proxy
👉 https://rollupjs.org/guide/en/#error-name-is-not-exported-by-module
Error: '__moduleExports' is not exported by node_modules/react/cjs/react.production.min.js, imported by /prep-snowpack/node_modules/react/cjs/react.production.min.js?commonjs-proxy
at error (/prep-snowpack/node_modules/rollup/dist/shared/rollup.js:161:30)
Other templates (svelte for instance) work as expected
Node: 12.16.3
yarn : 1.19.0
npm : 6.14.4
OS: Arch Linux
Original Discussion: https://www.pika.dev/npm/snowpack/discuss/232
/cc @yuheiy
Currently, @snowpack/plugin-webpack only works on SPAs, and assumes a single HTML file entrypoint. This wasn't a technical limitation, and our current code could be modified to run across every HTML file in your application.
When running snowpack build
on a project using typescript, error messages are shown "...missing required file extension" if I use imports without .ts
extension. The build output will also error if loaded on a browser.
The reason why omitting extensions when using typescript is desirable is because of this long-standing issue.
The good news is running snowpack build --bundle
works and produces a functioning output. Just wondering if anyone has a found a solution / compromise for this?
When setting up a new app with svelte the build step does not complete (?), the "build:js" step is missing. When opening the app in the browser the dev server answers with 404.
Steps to reproduce:
npx create-snowpack-app new-dir --template @snowpack/app-template-svelte
cd new-dir
sp dev
Node: 14.2
Snowpack: 2.0.0-beta.9
I am able to start a CSA app I created earlier (last weekish) just fine, the new created one does not work.
I get an error when trying to use the react template
pro/unnecessary » npx create-snowpack-app snowpack-webmail --template react
npx: installed 36 in 3.914s
- Using template react
- Creating a new project in /Users/ben/pro/unnecessary/snowpack-webmail
(node:81046) ExperimentalWarning: The fs.promises API is experimental
[ERROR] Template is not properly marked as a CSA template (Missing "csa-template" keyword in package.json).
[ERROR] Cannot continue safely. Exiting...
Add a CONTRIBUTING.md I would like to do this one for my first ever PR! 😊
Nice and easy unbreaking PR would you help through it @FredKSchott ?
I don't have a global git user.email
and user.name
and due to this git prompts for it when commiting anything.
(node:21972) UnhandledPromiseRejectionWarning: Error: Command failed with exit code 128: git commit -m initial commit
*** Please tell me who you are.
Run
git config --global user.email "[email protected]"
git config --global user.name "Your Name"
to set your account's default identity.
Omit --global to set the identity only in this repository.
fatal: unable to auto-detect email address (got '_@_.(none)')
at makeError (C:\Users\_\AppData\Roaming\npm-cache\_npx\21972\node_modules\create-snowpack-app\node_modules\execa\lib\error.js:59:11)
at handlePromise (C:\Users\_\AppData\Roaming\npm-cache\_npx\21972\node_modules\create-snowpack-app\node_modules\execa\index.js:114:26)
at processTicksAndRejections (internal/process/task_queues.js:97:5)
at async C:\Users\_\AppData\Roaming\npm-cache\_npx\21972\node_modules\create-snowpack-app\index.js:152:3
(node:21972) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:21972) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
npx/npm 6.14.4
node v12.16.3
I'm trying the Svelte template under Windows (not using WSL).
The installation is completing without an issue
npx create-snowpack-app myfolder --template @snowpack/app-template-svelte
npm start
although is producing an error while building:
Server started in 14ms.
mount:web_modules.......[DONE]
mount:public............[DONE]
plugin:svelte...........[READY]
build:js................[RUNNING]
▼ Console
[error] F:\dev\myfolder\src\index.js Error: Command failed with ENOENT: cat
spawn cat ENOENT
'cat' is not recognized as an internal or external command,
operable program or batch file.
at notFoundError (F:\DEV\myfolder\node_modules\snowpack\node_modules\cross-spawn\lib\enoent.js:6:26)
at verifyENOENT (F:\DEV\myfolder\node_modules\snowpack\node_modules\cross-spawn\lib\enoent.js:40:16)
at ChildProcess.cp.emit (F:\DEV\myfolder\node_modules\snowpack\node_modules\cross-spawn\lib\enoent.js:27:25)
...
``
I saw that right now resolveJsonModule
won't be true
by default for the react-typescript template (https://github.com/pikapkg/create-snowpack-app/blob/master/packages/app-scripts-react/tsconfig.base.json).
I would like to hear your thought about making it true
out of the box. I think it's very useful to be able to type-check an imported JSON file, and it doesn't hurt to have it turn on. FWIW, Create React App and Deno has it turned on by default as well.
If you think this is a good idea, I can help taking care of getting this option in :)
I am following the instructions here: https://www.snowpack.dev/#install-snowpack
where I first run
npm install --save-dev snowpack@next
in a directory to install the snowpack package. But when I try to run this in the directory with the package.json
file:
npx create-snowpack-app . --template @snowpack/app-template-react
It fails with this error: [ERROR] /Users/michaelhagar/personal/snowpack-test already exists
. So where am I supposed to target the snowpack app to?
Following on from the discussion in #29, I wonder what you would think about making installing Parcel optional? The dev environment in Snowpack V2 is brilliant and personally I think getting people set up with that as quickly and painlessly as possible should be the priority. Parcel installs a huge amount of dependencies (107.3 MB) and many users will still choose to use Webpack or Rollup to build for production. Snowpack-react-app isn't much lighter than create-react-app at the moment but would be much smaller if production bundling wasn't included by default. A script to add Parcel to an existing project would be great.
This is the first time I'm using Snowpack. Here is what I did:
My history:
yarn start
cd new-dir/
npx create-snowpack-app new-dir --template @snowpack/app-template-react-typescript --use-yarn
nvm use 12
cd Desktop/
cd
GET http://localhost:8080/web_modules/react.js net::ERR_ABORTED 404 (Not Found)
I ran all of the commands from VSCode. It prompted me to allow VSCode to control Chrome. I'm on Mac.
Other files are ok. I aw App.js being downloaded fine.
Hi, just tried the svelte template and the .svelte file do not have source map enabled. Any options to enable that ?
Note that the other .js file in src worls fine (since they are not transformed)
Upon running npx create-snowpack-app new-dir --template @snowpack/app-template-react-typescript
and then running npm start
in new-dir
, the following error occurs:
> @ start /workspaces/snowpack-test/new-dir
> snowpack dev
Snowpack Dev Server (Beta)
NOTE: Still experimental, default behavior may change.
Starting up...
Error: Cannot find module '/workspaces/snowpack-test/new-dir/web_modules/import-map.json'
Require stack:
- /workspaces/snowpack-test/new-dir/node_modules/snowpack/dist-node/index.js
- /workspaces/snowpack-test/new-dir/node_modules/snowpack/dist-node/index.bin.js
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:982:15)
at Function.Module._load (internal/modules/cjs/loader.js:864:27)
at Module.require (internal/modules/cjs/loader.js:1044:19)
at require (internal/modules/cjs/helpers.js:77:18)
at command$1 (/workspaces/snowpack-test/new-dir/node_modules/snowpack/dist-node/index.js:993:31)
at cli (/workspaces/snowpack-test/new-dir/node_modules/snowpack/dist-node/index.js:3159:11)
Looks like the web_modules import map isn't being created, but the docs say this will be done automatically upon installation
We first create the app from the template:
npx create-snowpack-app snowpack-svelte-test --template @snowpack/app-template-svelte --use-yarn
cd snowpack-svelte-test
yarn build
now works:
Snowpack
./build Building your application...
mount:public............[DONE]
mount:web_modules.......[DONE]
mount:src...............[DONE]
plugin:svelte...........[DONE]
bundle:*................[SKIP]
▼ bundle:*
npm install --save-dev parcel@^2.0.0-0
Install Parcel into your project to bundle for production. Set "devOptions.bundle = false" to remove this message.
▶ Build Complete!
Done in 0.52s.
If we do as the instructions says (using yarn
instead of npm
):
yarn add --dev parcel@^2.0.0-0
Now yarn build
fails with:
Snowpack
./build Building your application...
mount:public............[DONE]
mount:web_modules.......[DONE]
mount:src...............[DONE]
plugin:svelte...........[DONE]
bundle:*................[FAILED]
▼ bundle:*
Building index.html...
Building favicon.ico...
Building index.js...
🚨 Build failed.
@parcel/core: Failed to resolve './App.svelte' from '.build/_dist_/index.js'
/tmp/snowpack-svelte-test/.build/_dist_/index.js:1:17
> 1 | import App from "./App.svelte";
> | ^^^^^^^^^^^^^^
2 |
3 | var app = new App({
@parcel/resolver-default: Cannot load file './App.svelte' in '.build/dist'.
Error: Command failed with exit code 1: parcel build index.html --dist-dir /tmp/snowpack-svelte-test/build
@parcel/core: Failed to resolve './App.svelte' from '.build/_dist_/index.js'
/tmp/snowpack-svelte-test/.build/_dist_/index.js:1:17
> 1 | import App from "./App.svelte";
> | ^^^^^^^^^^^^^^
2 |
3 | var app = new App({
@parcel/resolver-default: Cannot load file './App.svelte' in '.build/dist'.
Building index.html...
Building favicon.ico...
Building index.js...
🚨 Build failed.
▼ Result
⚠️ Finished, with errors.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
The README.md generated by @snowpack/app-template-react-typescript
claims that npm run start
would start the development server on localhost:3000
, but when you actually run npm run dev
, it will open localhost:8080
(!) in your default browser.
I only saw this in @snowpack/app-template-react-typescript
and did not check is this also happens in the other packages.
Follow the instructions from the official site. After running npm start
, i get-
[error] [404] /web_modules/svelte/internal.js
✘ <project_dir>/node_modules/.cache/snowpack/dev/svelte/internal.js
I've verified that the file exists in
node_modules/.cache/snowpack/dev/svelte/internal.js
I've just been trying out Create Snowpack App and used the @snowpack/app-template-svelte
template. I ran npm run build
on a Hello World app (literally <h1>Hello world!</h1>
in App.svelte) and the javascript bundle was 31.13 KB. This should be much smaller (probably between 2 and 3 KB). I notice that svelte/internal.js is inside the web_modules folder and my guess is that this is being bundled in its entirety.
When running after installing snowpack@next (tried with snowpack as well), I get:
ver is not defined
I tried installing locally and globally.
Example run:
npx create-snowpack-app snowpack --template @snowpack/app-template-react-typescript
Node version: 14.2.0
Npm/npx version: 6.14.4
Running OS X Catalina
npx create-snowpack-app snowpack --template @snowpack/app-template-react [13:02:22]
npx: Installierte 36 in 1.876s
- Using template @snowpack/app-template-react
- Creating a new project in /home/christian/snowpack-webmail
⠹ snowpack installing... https://cdn.pika.dev/-/[email protected]/dist=es2019/csz.js
✘ /home/christian/snowpack-webmail/node_modules/react/cjs/react.production.min.js?commonjs-proxy
👉 https://rollupjs.org/guide/en/#error-name-is-not-exported-by-module
Blank template has a file App.css
in public
folder, but it isn't linked anywhere.
In earlier versions, the .css
file in src
folder was automatically transpiled and moved to dist
folder with build:css
if any. But that is no longer the case.
I've been using Snowpack to create a Lit-Element app and it's great. However live reloads only works for files modified directly in the /src directory. I have folders in there for each element and live reload does not work when I modify them. A normal reload doesn't work either. I have to restart the dev server to see changes.
How can I fix this? Here's my snowpack config:
{
"scripts": {
"mount:public": "mount public --to .",
"mount:web_modules": "mount web_modules",
"mount:src": "mount src --to _dist_",
"build:js": "cat"
},
"installOptions": {},
"devOptions": {}
}
I have tried to create an app with all the different templates but it always fails with the following output:
npx: installed 36 in 6.43s
- Using template @snowpack/app-template-blank
- Creating a new project in C:\repos\my-app
(node:3956) ExperimentalWarning: The fs.promises API is experimental
- Installing package dependencies. This might take a couple of minutes.
> deasync@0.1.20 install C:\repos\my-app\node_modules\deasync
> node ./build.js
`win32-x64-node-10` exists; testing
Binary is fine; exiting
> core-js@2.6.11 postinstall C:\repos\my-app\node_modules\core-js
> node -e "try{require('./postinstall')}catch(e){}"
> parcel-bundler@1.12.4 postinstall C:\repos\my-app\node_modules\parcel-bundler
> node -e "console.log('\u001b[35m\u001b[1mLove Parcel? You can now donate to our open collective:\u001b[22m\u001b[39m\n > \u001b[34mhttps://opencollective.com/parcel/donate\u001b[0m')"
Love Parcel? You can now donate to our open collective:
> https://opencollective.com/parcel/donate
> undefined prepare C:\repos\my-app
> snowpack
(node:11924) ExperimentalWarning: The fs.promises API is experimental
\ snowpack installing... canvas-confetti
TypeError: zlib.brotliCompressSync is not a function
at compareDependencies (C:\repos\my-app\node_modules\snowpack\dist-node\index.js:2370:22)
at Object.writeBundle (C:\repos\my-app\node_modules\snowpack\dist-node\index.js:2409:7)
at Promise.resolve.then (C:\repos\my-app\node_modules\rollup\dist\shared\rollup.js:18156:25)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! undefined prepare: `snowpack`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the undefined prepare script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\c097645\AppData\Roaming\npm-cache\_logs\2020-05-07T22_36_35_047Z-debug.log
(node:3956) UnhandledPromiseRejectionWarning: Error: Command failed with exit code 1: npm install --loglevel error
at makeError (C:\Users\c097645\AppData\Roaming\npm-cache\_npx\3956\node_modules\create-snowpack-app\node_modules\execa\lib\error.js:58:11)
at handlePromise (C:\Users\c097645\AppData\Roaming\npm-cache\_npx\3956\node_modules\create-snowpack-app\node_modules\execa\index.js:114:26)
at process._tickCallback (internal/process/next_tick.js:68:7)
(node:3956) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:3956) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code. ```
You forgot Angular starter kit
I'm not able to run the default app created by CSA for react/typescript.
Steps to reproduce:
npx create-snowpack-app myapp --template @snowpack/app-template-react-typescript
cd myapp
npm run start
Seeing a blank page in the browser with an error in the console:
Uncaught TypeError: Cannot read property 'unstable_cancelCallback' of undefined
at react-dom.js:340
at react-dom.js:175
at react-dom.js:175
at createCommonjsModule (_commonjsHelpers-f5462f22.js:4)
at react-dom.js:174
Hello,
I've been willing to use create-snowpack-app
with template @snowpack/app-template-react
as such:
npx create-snowpack-app zenoid-web --template @snowpack/app-template-react --use-yarn
I'm using Node LTS (12.x) and I've also tried using npm
instead of yarn
but still get the following error:
$ snowpack
⠼ snowpack installing... https://cdn.pika.dev/-/[email protected]/dist=es2019/csz.js
✘ /Users/charly/tmp/zenoid-web/node_modules/react/cjs/react.production.min.js?commonjs-proxy
👉 https://rollupjs.org/guide/en/#error-name-is-not-exported-by-module
Error: '__moduleExports' is not exported by node_modules/react/cjs/react.production.min.js, imported by /Users/charly/tmp/zenoid-web/node_modules/react/cjs/react.production.min.js?commonjs-proxy
at error (/Users/charly/tmp/zenoid-web/node_modules/rollup/dist/shared/rollup.js:161:30)
at Module.error (/Users/charly/tmp/zenoid-web/node_modules/rollup/dist/shared/rollup.js:15006:16)
at handleMissingExport (/Users/charly/tmp/zenoid-web/node_modules/rollup/dist/shared/rollup.js:14905:28)
at Module.traceVariable (/Users/charly/tmp/zenoid-web/node_modules/rollup/dist/shared/rollup.js:15401:24)
at ModuleScope.findVariable (/Users/charly/tmp/zenoid-web/node_modules/rollup/dist/shared/rollup.js:13957:39)
at Identifier$1.bind (/Users/charly/tmp/zenoid-web/node_modules/rollup/dist/shared/rollup.js:9861:40)
at ExportDefaultDeclaration.bind (/Users/charly/tmp/zenoid-web/node_modules/rollup/dist/shared/rollup.js:9494:23)
at Program$1.bind (/Users/charly/tmp/zenoid-web/node_modules/rollup/dist/shared/rollup.js:9490:31)
at Module.bindReferences (/Users/charly/tmp/zenoid-web/node_modules/rollup/dist/shared/rollup.js:14978:18)
at Graph.link (/Users/charly/tmp/zenoid-web/node_modules/rollup/dist/shared/rollup.js:18414:20)
error Command failed with exit code 1.
Ideas on combining the two together as a template/starter project?
Also can snowpack take any npm package and pack it for client side use or only specific ones
A Svelte template with svelte-preprocess config working would cover many of the potential requests for Svelte templates (eg: typescript, postcss/tailwindcss).
Although the documentation for snowpack recommends using babel via the plugin for performance reasons, the scripts config from @snowpack/app-scripts-react uses the babel cli.
Is there a reason this shouldn't be the plugin (at least in the case where a babel config is found in the project folder?)
The reason I started investigating was that, for some reason (to be determined why), source maps are correctly created at dev time when using babel via the plugin and they are not with the app-scripts-react script setup. Without sourcemaps, it's pretty unpleasant to debug the application at dev time as you only ever see the babel-ified javascript in Chrome debug tools. Making my own scripts config and switching to the babel plugin fixed it, but I'm not clear on why.
Steps to reproduce:
npx create-snowpack-app new-project --template @snowpack/app-template-react
cd new-project
npm run start
Then I removed node modules and lock file
rm -rf node_modules && rm package-lock.json
npm install
npm run start
Then I get this error, and things are broken:
Error: Parse error @:11:60
at Object.parse
at getInstallTargetsForFile
at Array.map (<anonymous>)
at scanImports
at async command
at async command
NPM Ignore is ignoring the web-modules folder and causes npm start
and npm build
to fail with these errors:
Error: Cannot find module '/snowpack-react/web_modules/import-map.json'
Require stack:
- /snowpack-react/node_modules/snowpack/dist-node/index.js
- /snowpack-react/node_modules/snowpack/dist-node/index.bin.js
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:797:15)
at Function.Module._load (internal/modules/cjs/loader.js:690:27)
at Module.require (internal/modules/cjs/loader.js:852:19)
at require (internal/modules/cjs/helpers.js:74:18)
at command$1 (/snowpack-react/node_modules/snowpack/dist-node/index.js:941:31)
at cli (/snowpack-react/node_modules/snowpack/dist-node/index.js:3026:11)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @ start: `snowpack dev`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the @ start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
This seems to be possible on mac, at least. See: https://github.com/facebook/create-react-app/blob/25184c4e91ebabd16fe1cde3d8630830e4a36a01/packages/react-dev-utils/openBrowser.js#L65-L86
Running the build via "npm run build" with the --bundle flag is failing on windows 10 (without the --bundle flag it succeeds but there are missing files ie. there's no dist folder):
Snowpack
.\build Building your application...
mount:web_modules.......[DONE]
mount:public............[DONE]
plugin:svelte...........[DONE]
build:js................[DONE]
bundle:*................[FAILED]
▼ bundle:*
× C:\home\new-dir.build_dist_\index.js: ENOENT: no such file or directory, open 'C:\home\new-dir.build_dist_\index.js'
Error: ENOENT: no such file or directory, open 'C:\home\new-dir.build_dist_\index.js'
Error: Command failed with exit code 1: parcel build index.html --out-dir C:\home\new-dir\build
× C:\home\new-dir.build_dist_\index.js: ENOENT: no such file or directory, open 'C:\home\new-dir.build_dist_\index.js'
Error: ENOENT: no such file or directory, open 'C:\home\new-dir.build_dist_\index.js'
▼ Result
Software used:
Microsoft Windows [Version 10.0.18363.815]
node 12.16.1
npm 6.13.4
Just wanted to give snowpack a first shot, but create-snowpack-app
keeps failing:
user@home:~:^$ npx create-snowpack-app snowpack-test --template "@snowpack/app-template-svelte" --use-yarn --force
npx: Installierte 36 in 1.994s
- Using template @snowpack/app-template-svelte
- Creating a new project in /home/user/snowpack-test
(node:847187) UnhandledPromiseRejectionWarning: Error: Command failed with exit code 243: npm install @snowpack/app-template-svelte --ignore-scripts
at makeError (/home/user/.npm/_npx/847187/lib/node_modules/create-snowpack-app/node_modules/execa/lib/error.js:59:11)
at handlePromise (/home/user/.npm/_npx/847187/lib/node_modules/create-snowpack-app/node_modules/execa/index.js:114:26)
at processTicksAndRejections (internal/process/task_queues.js:97:5)
at async /home/user/.npm/_npx/847187/lib/node_modules/create-snowpack-app/index.js:127:3
(node:847187) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:847187) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
To my surprise, the failing command executes just fine when I execute it manually in the terminal:
user@home:~/testing:^$ npm install @snowpack/app-template-svelte --ignore-scripts
npm WARN lifecycle The node binary used for scripts is /snap/bin/node but npm is using /snap/node/2776/bin/node itself. Use the `--scripts-prepend-node-path` option to include the path for the node binary npm was executed with.
npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@~2.1.2 (node_modules/chokidar/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@~2.1.2 (node_modules/chokidar/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN @babel/[email protected] requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @rollup/[email protected] requires a peer of rollup@^1.20.0 but none is installed. You must install peer dependencies yourself.
npm WARN testing No description
npm WARN testing No repository field.
npm WARN testing No license field.
+ @snowpack/[email protected]
added 22 packages from 3 contributors, removed 18 packages, updated 219 packages and audited 244 packages in 11.864s
22 packages are looking for funding
run `npm fund` for details
found 0 vulnerabilities
Any suggestions?
Setup:
node: 12.17.0
npm: 6.14.4
yarn: 1.22.4
OS: GNU/Linux / x86_64 / 5.4.0-31-generic
Hi,
Trying to understand and take advantage of svelte hmr. Really don't know if is just enough to include the hmr snippet in index.js, or if there's additional setup required on a per component basis in order to take full advantage of it.
The index.js is configured with the hmr code:
import App from "./App.svelte";
...
// Hot Module Replacement (HMR) - Remove this snippet to remove HMR.
// Learn more: https://www.snowpack.dev/#hot-module-replacement
if (import.meta.hot) {
import.meta.hot.accept();
import.meta.hot.dispose(() => {
app.$destroy();
});
}
My svelte app is using a client side router (Navaid) with dynamic imports and works great with snowpack.
//App.js
// home component statically imported
import index from './routes/index.svelte';
router = Navaid('/')
// home route in same bundle as App.js
.on('/', () => run(Promise.resolve(index)))
// other routes dynamically imported
.on('/about', () => run(import('./routes/about.svelte')))
.on('/sign-up', () => run(import('./routes/sign-up/index.svelte')))
.on('/play/:band', params => run(import('./routes/play/index.svelte'), params))
.listen();
If I change the statically imported index.svelte
component, the hmr module signals an update of _dist_/index.js
which in turn reloads the statically imported component chain.
If I change the dynamically imported components, the hmr module signals a full page reload. Maybe more hmr configuration code is required to make dynamically imported components to update instead of a full reload.
Thanks!!
a fresh start with app-template svelte fails to start/build
setup:
npx create-snowpack-app snowpack-svelte-app --template @snowpack/app-template-svelte
cd snowpack-svelte-app
npm start
Snowpack
http://localhost:8080 > http://192.168.2.119:8080
Server started in 5ms.
mount:web_modules.......[DONE] mount $WEB_MODULES --to /web_modules
mount:public............[DONE] mount public --to /
mount:src...............[DONE] mount src --to /_dist_
build:js,jsx,ts,tsx.....[READY] (default) esbuild
build:svelte............[READY] (plugin) @snowpack/plugin-svelte
npm run build
Snowpack
./build Building your application...
mount:web_modules.......[DONE] mount $WEB_MODULES --to /web_modules
mount:public............[DONE] mount public --to /
mount:src...............[DONE] mount src --to /_dist_
build:js,jsx,ts,tsx.....[DONE] (default) esbuild
build:svelte............[RUNNING] (plugin) @snowpack/plugin-svelte
bundle:*................[SKIP]
▼ Snowpack
Dependency svelte/internal not found!
versions:
os: ubuntu 18.04
node: 12.17.0
npm: 6.14.5
create-snowpack-app: 1.0.0
Hi,
I'm still trying to understand how hmr works in snowpack.
Using the default template 0.8.0. When I change the css part of App.js, the hmr module reloads only the js part of the component. I see following resources loaded in the network tab.
_dist_/index.js?mtime=159....
_dist_/App.js?mtime=159
But as the change is in the css part, and svelte regenerates the scoped css, the css part of the component App.css.proxy.js
should be loaded as well .
Thanks so much for all the great features in snowpack.
I've tried the Vue, blank and React templates, but they all cause the same error:
- Using template @snowpack/app-template-react
- Creating a new project in /Users/yann/development/snowpack2/new-dir
(node:32733) UnhandledPromiseRejectionWarning: Error: ENOENT: no such file or directory, stat '/Users/yann/development/snowpack2/new-dir/node_modules/@snowpack/app-template-react'
(Use `node --trace-warnings ...` to show where the warning was created)
(node:32733) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:32733) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
Env: macOS Catalina, node@14/12/10
Hi, snowpack team.
It's a great project. I love snowpack! 👍
I think ESLint is a JavaScript standard Lint tool,
so I hope ESLint is included in these boilerplates.
npx create-snowpack-app new-dir --template @snowpack/app-template-react-typescript --use-yarn
yarn build
serve ./build
Open the built bundle in the browser and it throws the following error (with no rendering):
Uncaught ReferenceError: $RefreshSig$ is not defined
Same happens by adding the webpack plugin + adding this in the config file:
{
"extends": "@snowpack/app-scripts-react",
"scripts": {
"bundle:*": "@snowpack/plugin-webpack"
},
"plugins": [
"@snowpack/plugin-webpack"
]
}
Any idea why this is happening?
Thanks
Running npm run build
creates svelte components in dev mode. This seems to be correctly implemented in plugin-svelte
so the plugin must not receive the correct environment variable.
Hi,
I need to use the Apollo React client in my project and using Snowpack it does not seem to work because @apollo/client uses a "require()" instruction somewhere in its bundle, is there any documented workaround for those kind of setup, also according to pika @apollo/client seems to be fine in terms of exposing a module endpoint.
Thanks
Hi! 👋
I wanted to check out create-snowpack-app - it looks very promising!
So I've created a new repo on GitHub and checked it out locally.
Unfortunately, create-snowpack-app
doesn't allow to create app in existing directory, which is a little annoying.
Would you accept a PR, which will allow to create project in existing directory?
I'll be happy to contribute :)
Cheers!
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.