Help creating an custom component

App Building
, ,
1

Hello, im trying to create an custom component with the new version, using npx retool. However, when i use "npx retool-ccl login" it gives me this issue:

npx retool-ccl login
/Users/my_pc/Desktop/Code/Custom Components - Retool/new-custom-component/node_modules/@tryretool/custom-component-support/retool_client/runtime.js:120

static{
          ^
SyntaxError: Unexpected token '{'
    at wrapSafe (internal/modules/cjs/loader.js:979:16)
    at Module._compile (internal/modules/cjs/loader.js:1027:27)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14)
    at Module.require (internal/modules/cjs/loader.js:952:19)
    at require (internal/modules/cjs/helpers.js:88:18)
    at Object.<anonymous> (/Users/my_pc/Desktop/Code/Custom Components - Retool/new-custom-component/node_modules/@tryretool/custom-component-support/retool_client/index.js:5:14)
    at Module._compile (internal/modules/cjs/loader.js:1063:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)

or, if i replace retool-ccl with my retool_apikey generated when i create an api for custom components in retool it gives me this other issue:

npx retool_apikey login
npm ERR! code E404
npm ERR! 404 Not Found - GET https://registry.npmjs.org/retool_apikey - Not found
npm ERR! 404 
npm ERR! 404  'retool_apikey@latest' is not in this registry.
npm ERR! 404 
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, http url, or git url.

Thank you in advance!

2

Hey @mjhen1 ,
For deploy custom component in Retool,
First you have to generate api-token from your retool account: Settings > Retool-API > Generate new token . (Make sure that you give all permissions in this token)
Then, write in terminal : npx retool-ccl login then login with your username and password
then it needs api-token , paste that token into it .
After these steps , your retool account logged in successfully.

If you need any help or any confussion then contact me again.

3

Hi @WidleStudioLLP, thanks for your answer.

Yes, im following this guide: Custom component libraries | Retool Docs

In the third point, when doing "npx retool-ccl login" it returns:

/Users/my_pc/Desktop/Code/new-custom-component/node_modules/@tryretool/custom-component-support/retool_client/runtime.js:120
    static{
          ^

SyntaxError: Unexpected token '{'
    at wrapSafe (internal/modules/cjs/loader.js:979:16)
    at Module._compile (internal/modules/cjs/loader.js:1027:27)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14)
    at Module.require (internal/modules/cjs/loader.js:952:19)
    at require (internal/modules/cjs/helpers.js:88:18)
    at Object.<anonymous> (/Users/my_pc/Desktop/Code/new-custom-component/node_modules/@tryretool/custom-component-support/retool_client/index.js:5:14)
    at Module._compile (internal/modules/cjs/loader.js:1063:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)

And i cant continue the login process after that issue.

4

I tried again but i didn't see any error

image
image1010×139 9.35 KB

can you record video from begining of the process?

5

There u go, watching your screenshot you use windows powershell? or wsl?

In zsh (macOS) outputs this, here is the video. Also, if i use like npx retool login it works, but if i use retool-ccl login it doesnt.

Using this command retool --version is 1.0.26, is the same for you?

here is the video: Watch Grabación de pantalla 2024-07-16 a las 17.44.36 | Streamable

6

Hey,
retool --version command does not works in my VS code terminal.
your video is not loading
image

7

oh sorry, this link works?

1 Like
8

Hey @mjhen1 ,
I saw your video, by retool login, yor account is logged in successfully then go with another steps of deploying custom component and see that any kind of error comes or not.
If any error comes then share.