mioquispe / create-ic-app Goto Github PK
View Code? Open in Web Editor NEWUse your favourite frontend framework with the Internet Computer
Use your favourite frontend framework with the Internet Computer
Would you be open to receiving a PR with an Angular template?
I have a project created with create-ic-app@latest command, leaving intact it, it works fine in local, but it doesn´t works in ic, throwing the following javascript error in browser console:
Unable to fetch root key. Check to ensure that your local replica is running
Error: Failed to parse
at Uint8ArrayDecoder$2._decode (index.6fb51243.js:65:66389)
at Uint8ArrayDecoder$2.decodeFirst (index.6fb51243.js:65:66504)
at decode$5 (index.6fb51243.js:66:10453)
at HttpAgent$1.status (index.6fb51243.js:78:11)
at async HttpAgent$1.fetchRootKey (index.6fb51243.js:78:108)
(
caught (in promise) Error: Failed to parse
at Uint8ArrayDecoder$2._decode (index.6fb51243.js:65:66389)
at Uint8ArrayDecoder$2.decodeFirst (index.6fb51243.js:65:66504)
at decode$5 (index.6fb51243.js:66:10453)
at HttpAgent$1.query (index.6fb51243.js:72:11)
at async _e (index.6fb51243.js:885:2960)
at async pr (index.6fb51243.js:2786:3025)
I think that this happens when receiving the response from the backend canister, but I'm not entirely sure
The issue can be easily replicated by creating a project and deploying it to ic without making any changes or additions to the code like these commands:
npx create-ic-app
dfx deploy --network ic
--> set name, package empty, and select react option
Open the url with the frontend canister and check javascript console.
Thanks for your help
I created a template for react with tailwind based on your react template. Would you be interested to add it to this repo?
when use local frontend, the agentjs raise "DestinationInvalid" error. use frontend in ic network canister no this error.
Hi, I am planning to work on the rust support. I would like to know if anyone else would want tot contribute.
failed to load config from /site/vite.config.ts
error during build:
Error: Not supported
Any idea why this is happening?
I followed the steps of the tutorial and got an error at the last step(npm run dev), the error log is:
`
11:38:46 [vite] http proxy error:
Error: connect ECONNREFUSED ::1:8000
at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1157:16) (x2)
`
the type of project is react -> js/ts,
when us http://127.0.0.1:8000/?canisterId=rrkah-fqaaa-aaaaa-aaaaq-cai in browser the page works fine
Hey,
Looks like you published the dev branch instead of the main branch maybe?
I get error when I run npx create-ic-app@latest
Error: ENOENT: no such file or directory, scandir /node_modules/create-ic-app/langs'
It's looking for the lang
directory but it's not there on main, however I found the last PR for internationalization is merged to dev instead which had the lang dir.
Thanks for the work you are doing, we are trying to get a successful "svelte" Javascript install on Ubuntu 20.04 dfx version 0.8.1 and on running "dfx deploy" we are hitting the following messages...
The post-build step failed for canister 'rrkah-fqaaa-aaaaa-aaaaq-cai' with an embedded error: The command '"npm" "run" "build"' failed with exit status 'exit code: 1'.
Stdout:
[email protected] build
vite build
Stderr:
internal/modules/cjs/loader.js:638
throw err;
^
Error: Cannot find module 'worker_threads'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:636:15)
at Function.Module._load (internal/modules/cjs/loader.js:562:25)
at Module.require (internal/modules/cjs/loader.js:692:17)
at require (internal/modules/cjs/helpers.js:25:18)
at Object. (/home/mikebrunt/create-ic-app-main_2/create_ic_app/svelte-version/node_modules/vite/dist/node/chunks/dep-55830a1a.js:14:20)
at Module._compile (internal/modules/cjs/loader.js:778:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:789:10)
at Module.load (internal/modules/cjs/loader.js:653:32)
at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
at Function.Module._load (internal/modules/cjs/loader.js:585:3)
The guide says 0.8.2 as the latest, though I have 0.10.0. After I npm install
dfx start
and then...
dfx deploy
Creating a wallet canister on the local network.
The wallet canister on the "local" network for user "default" is "rklht-iiaaa-aaaaa-aaaaa-cai"
Deploying all canisters.
Creating canisters...
Creating canister "assets"...
"assets" canister created with canister id: "rrkah-fqaaa-aaaaa-aaaaq-cai"
Creating canister "counter"...
"counter" canister created with canister id: "ryjl3-tyaaa-aaaaa-aaaba-cai"
Building canisters...
Building frontend...
Error: The post-build step failed for canister 'rrkah-fqaaa-aaaaa-aaaaq-cai' (assets) with an embedded error: The command '"npm" "run" "build"' failed with exit status 'exit status: 1'.
Stdout:
> [email protected] build
> vite build
vite v2.9.13 building for production...
transforming...
✓ 394 modules transformed.
Stderr:
Use of eval is strongly discouraged, as it poses security risks and may cause issues with minification
Use of eval is strongly discouraged, as it poses security risks and may cause issues with minification
'PipeArrayBuffer' is not exported by node_modules/@dfinity/candid/lib/esm/index.js, imported by node_modules/@dfinity/agent/lib/esm/canisterStatus/index.js
file: ~/node_modules/@dfinity/agent/lib/esm/canisterStatus/index.js:2:20
1: /** @module CanisterStatus */
2: import { lebDecode, PipeArrayBuffer } from '@dfinity/candid';
^
3: import { Principal } from '@dfinity/principal';
4: import { Cbor, Certificate, toHex } from '..';
error during build:
Error: 'PipeArrayBuffer' is not exported by node_modules/@dfinity/candid/lib/esm/index.js, imported by node_modules/@dfinity/agent/lib/esm/canisterStatus/index.js
at error (~/node_modules/rollup/dist/shared/rollup.js:198:30)
at Module.error (~/node_modules/rollup/dist/shared/rollup.js:12555:16)
at Module.traceVariable (~/node_modules/rollup/dist/shared/rollup.js:12914:29)
at ModuleScope.findVariable (~/node_modules/rollup/dist/shared/rollup.js:11566:39)
at ReturnValueScope.findVariable (~/node_modules/rollup/dist/shared/rollup.js:6486:38)
at ChildScope.findVariable (~/node_modules/rollup/dist/shared/rollup.js:6486:38)
at Identifier.bind (~/node_modules/rollup/dist/shared/rollup.js:7553:40)
at NewExpression.bind (~/node_modules/rollup/dist/shared/rollup.js:5383:23)
at CallExpression.bind (~/node_modules/rollup/dist/shared/rollup.js:5379:73)
at CallExpression.bind (~/node_modules/rollup/dist/shared/rollup.js:9049:15)
To fix what is recommended? I'm guessing it is a mismatch due to dfx versions, but is not 0.10.0 the latest?
The counter.did.js file can't be found under ../.dfx/local/canisters/counter. I tried react+javascript and react+typescript. Seems the build needs to include dfx generate.
I had to: 1) generate the candid interfaces manually using dfx generate. 2) Update the App.jsx file with the proper import:
import * as counter from "../src/declarations/counter"
Stderr:
Could not resolve './counter.did.js' from .dfx/local/canisters/counter/index.js
error during build:
Error: Could not resolve './counter.did.js' from .dfx/local/canisters/counter/index.js
at error (/home/hosermage/projects/dfinity/create-ic-app/ledger_sample_react/node_modules/rollup/dist/shared/rollup.js:198:30)
at ModuleLoader.handleResolveId (/home/hosermage/projects/dfinity/create-ic-app/ledger_sample_react/node_modules/rollup/dist/shared/rollup.js:22464:24)
at /home/hosermage/projects/dfinity/create-ic-app/ledger_sample_react/node_modules/rollup/dist/shared/rollup.js:22427:26
Hello!
agentOptions: the identity is never passed to this. So on local all may seem well, but when you push to the IC all msg.caller fields will be anonymous making all msg.callers the same Principal.
There needs to be a way to pass the currently logged in user to agentOptions as identity. This will allow the calls to be made as that person for shared(msg) in Motoko.
Let me know if there is already a way to pass the identity into the createActor.
I followed the instructions in the README.md, I can launch the boilerplate project, but whenever I hit the counter button something seems wrong regarding certification. My guess would be that something is not in order with certification but I wonder how to approach this.
Specs
dfx 0.7.0-beta.8
Ubuntu 20.04.2 LTS
Node v16.1.0
npm 7.13.0
Vite config:
P.S. thanks for this project 🙏
I needed a time input so initially was going to use: https://www.npmjs.com/package/react-time-picker however, when I try to do the basic example I get the following console error:
Uncaught Error: Dynamic require of "~/node_modules/react-clock/dist/Clock.css" is not supported
__require chunk-ACCAMVX6.js:12
js entry.js:8
__require2 chunk-ACCAMVX6.js:18
<anonymous> react-time-picker:1
[chunk-ACCAMVX6.js:12:9](http://localhost:3000/node_modules/.vite/deps/chunk-ACCAMVX6.js?v=7a9889ac)
__require chunk-ACCAMVX6.js:12
js entry.js:8
__require2 chunk-ACCAMVX6.js:18
<anonymous> react-time-picker:1
InnerModuleEvaluation self-hosted:2325
InnerModuleEvaluation self-hosted:2325
InnerModuleEvaluation self-hosted:2325
InnerModuleEvaluation self-hosted:2325
evaluation self-hosted:2286
Not that this is critical thing, there are many ways to add time inputs, but in case it reflects a more significant issue I thought I'd post the issue here.
Could not find a declaration file for module '@connect2ic/svelte'. '/Users/pramitgaha/programs/icp/local-icp/node_modules/@connect2ic/svelte/dist/connect2ic-svelte.cjs.js' implicitly has an 'any' type.
Try npm i --save-dev @types/connect2ic__svelte
if it exists or add a new declaration (.d.ts) file containing declare module '@connect2ic/svelte';
Any plans for that?
Following the instructions of README.md:
[andre@nopogi connect2ic]$ npm i
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/svelte
npm ERR! dev svelte@"^3.42.5" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer svelte@"^4.0.0" from @sveltejs/[email protected]
npm ERR! node_modules/@sveltejs/vite-plugin-svelte
npm ERR! dev @sveltejs/vite-plugin-svelte@"next" 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!
npm ERR! For a full report see:
npm ERR! /home/andre/.npm/_logs/2023-11-02T15_05_13_317Z-eresolve-report.txt
npm ERR! A complete log of this run can be found in: /home/andre/.npm/_logs/2023-11-02T15_05_13_317Z-debug-0.log
[andre@nopogi connect2ic]$ npm i --force
npm WARN using --force Recommended protections disabled.
npm WARN ERESOLVE overriding peer dependency
npm WARN ERESOLVE overriding peer dependency
npm WARN ERESOLVE overriding peer dependency
npm WARN While resolving: @sveltejs/[email protected]
npm WARN Found: [email protected]
npm WARN node_modules/svelte
npm WARN peer svelte@"^4.0.0" from @sveltejs/[email protected]
npm WARN node_modules/@sveltejs/vite-plugin-svelte/node_modules/@sveltejs/vite-plugin-svelte-inspector
npm WARN @sveltejs/vite-plugin-svelte-inspector@"^2.0.0-next.0 || ^2.0.0" from @sveltejs/[email protected]
npm WARN node_modules/@sveltejs/vite-plugin-svelte
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer svelte@"^4.0.0" from @sveltejs/[email protected]
npm WARN node_modules/@sveltejs/vite-plugin-svelte
npm WARN dev @sveltejs/vite-plugin-svelte@"next" from the root project
npm WARN 1 more (@sveltejs/vite-plugin-svelte-inspector)
npm WARN
npm WARN Conflicting peer dependency: [email protected]
npm WARN node_modules/svelte
npm WARN peer svelte@"^4.0.0" from @sveltejs/[email protected]
npm WARN node_modules/@sveltejs/vite-plugin-svelte
npm WARN dev @sveltejs/vite-plugin-svelte@"next" from the root project
npm WARN 1 more (@sveltejs/vite-plugin-svelte-inspector)
npm WARN ERESOLVE overriding peer dependency
npm WARN While resolving: @sveltejs/[email protected]
npm WARN Found: [email protected]
npm WARN node_modules/vite
npm WARN peer vite@"^5.0.0-beta.1 || ^5.0.0" from @sveltejs/[email protected]
npm WARN node_modules/@sveltejs/vite-plugin-svelte/node_modules/@sveltejs/vite-plugin-svelte-inspector
npm WARN @sveltejs/vite-plugin-svelte-inspector@"^2.0.0-next.0 || ^2.0.0" from @sveltejs/[email protected]
npm WARN node_modules/@sveltejs/vite-plugin-svelte
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer vite@"^5.0.0-beta.1 || ^5.0.0" from @sveltejs/[email protected]
npm WARN node_modules/@sveltejs/vite-plugin-svelte
npm WARN dev @sveltejs/vite-plugin-svelte@"next" from the root project
npm WARN 1 more (@sveltejs/vite-plugin-svelte-inspector)
npm WARN
npm WARN Conflicting peer dependency: [email protected]
npm WARN node_modules/vite
npm WARN peer vite@"^5.0.0-beta.1 || ^5.0.0" from @sveltejs/[email protected]
npm WARN node_modules/@sveltejs/vite-plugin-svelte
npm WARN dev @sveltejs/vite-plugin-svelte@"next" from the root project
npm WARN 1 more (@sveltejs/vite-plugin-svelte-inspector)
npm WARN ERESOLVE overriding peer dependency
npm WARN While resolving: [email protected]
npm WARN Found: [email protected]
npm WARN node_modules/vite
npm WARN peer vite@"^5.0.0-beta.1 || ^5.0.0" from @sveltejs/[email protected]
npm WARN node_modules/@sveltejs/vite-plugin-svelte/node_modules/@sveltejs/vite-plugin-svelte-inspector
npm WARN @sveltejs/vite-plugin-svelte-inspector@"^2.0.0-next.0 || ^2.0.0" from @sveltejs/[email protected]
npm WARN node_modules/@sveltejs/vite-plugin-svelte
npm WARN
npm WARN Could not resolve dependency:
npm WARN peerOptional vite@"^3.0.0 || ^4.0.0 || ^5.0.0" from [email protected]
npm WARN node_modules/@sveltejs/vite-plugin-svelte/node_modules/vitefu
npm WARN vitefu@"^0.2.5" from @sveltejs/[email protected]
npm WARN node_modules/@sveltejs/vite-plugin-svelte
npm WARN
npm WARN Conflicting peer dependency: [email protected]
npm WARN node_modules/vite
npm WARN peerOptional vite@"^3.0.0 || ^4.0.0 || ^5.0.0" from [email protected]
npm WARN node_modules/@sveltejs/vite-plugin-svelte/node_modules/vitefu
npm WARN vitefu@"^0.2.5" from @sveltejs/[email protected]
npm WARN node_modules/@sveltejs/vite-plugin-svelte
npm WARN deprecated @types/[email protected]: This is a stub types definition. sass provides its own type definitions, so you do not need this installed.
npm WARN deprecated [email protected]: Please use @jridgewell/sourcemap-codec instead
added 130 packages, and audited 131 packages in 16s
16 packages are looking for funding
run npm fund
for details
found 0 vulnerabilities
[andre@nopogi connect2ic]$
[andre@nopogi connect2ic]$
[andre@nopogi connect2ic]$
[andre@nopogi connect2ic]$
[andre@nopogi connect2ic]$
[andre@nopogi connect2ic]$ dfx start --background --clean
Running dfx start for version 0.15.1
Using project-specific network 'local' defined in /home/andre/play/tic/connect2ic/dfx.json
Initialized replica.
Dashboard: http://localhost:34539/_/dashboard
[andre@nopogi connect2ic]$ dfx deploy
Deploying all canisters.
Creating a wallet canister on the local network.
The wallet canister on the "local" network for user "default" is "bnz7o-iuaaa-aaaaa-qaaaa-cai"
Creating canisters...
Creating canister assets...
assets canister created with canister id: bkyz2-fmaaa-aaaaa-qaaaq-cai
Creating canister counter...
counter canister created with canister id: bd3sg-teaaa-aaaaa-qaaba-cai
Building canisters...
Building frontend...
Error: Failed while trying to deploy canisters.
Caused by: Failed while trying to deploy canisters.
Failed to build all canisters.
Failed while trying to build all canisters.
The post-build step failed for canister 'bkyz2-fmaaa-aaaaa-qaaaq-cai' (assets) with an embedded error: Failed to build frontend for network 'local'.: The command 'cd "/home/andre/play/tic/connect2ic" && ASSETS_CANISTER_ID="bkyz2-fmaaa-aaaaa-qaaaq-cai" CANISTER_CANDID_PATH="/home/andre/play/tic/connect2ic/.dfx/local/canisters/assets/assetstorage.did" CANISTER_CANDID_PATH_COUNTER="/home/andre/play/tic/connect2ic/.dfx/local/canisters/counter/counter.did" CANISTER_CANDID_PATH_counter="/home/andre/play/tic/connect2ic/.dfx/local/canisters/counter/counter.did" CANISTER_ID="bkyz2-fmaaa-aaaaa-qaaaq-cai" CANISTER_ID_ASSETS="bkyz2-fmaaa-aaaaa-qaaaq-cai" CANISTER_ID_COUNTER="bd3sg-teaaa-aaaaa-qaaba-cai" CANISTER_ID_assets="bkyz2-fmaaa-aaaaa-qaaaq-cai" CANISTER_ID_counter="bd3sg-teaaa-aaaaa-qaaba-cai" COUNTER_CANISTER_ID="bd3sg-teaaa-aaaaa-qaaba-cai" DFX_NETWORK="local" DFX_VERSION="0.15.1" "npm" "run" "build"' failed with exit status 'exit status: 1'.
Stdout:
[email protected] build
tsc && vite build
Stderr:
failed to load config from /home/andre/play/tic/connect2ic/vite.config.ts
error during build:
Error [ERR_PACKAGE_PATH_NOT_EXPORTED]: No "exports" main defined in /home/andre/play/tic/connect2ic/node_modules/@sveltejs/vite-plugin-svelte/package.json
at new NodeError (node:internal/errors:405:5)
at exportsNotFound (node:internal/modules/esm/resolve:359:10)
at packageExportsResolve (node:internal/modules/esm/resolve:639:13)
at resolveExports (node:internal/modules/cjs/loader:567:36)
at Module._findPath (node:internal/modules/cjs/loader:636:31)
at Module._resolveFilename (node:internal/modules/cjs/loader:1063:27)
at Module._load (node:internal/modules/cjs/loader:922:27)
at Module.require (node:internal/modules/cjs/loader:1143:19)
at require (node:internal/modules/cjs/helpers:121:18)
at Object. (/home/andre/play/tic/connect2ic/vite.config.ts:31:33)
Hi,
Internet Identity dev here. Just a quick note: It would be good if the templates included the Internet Identity dev build for local authentication. The reason being that the local replica will not accept canister signatures from mainnet. So to really develop canisters enforcing authentication with Internet Identity the dev build has to be used anyways.
We have a complete working example of how to most easily accomplish this here: https://github.com/dfinity/internet-identity/tree/main/demos/using-dev-build
Best regards,
Frederik
Hi there, do you have a website? I could include that in my awesome IC list if you are planning to launch the service/app.
Hello,
Thanks for the great work.
I noticed that latest
on npm is pointing at 0.1.7
and not to latest
https://www.npmjs.com/package/create-ic-app/v/0.0.9
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.