hyperbrew / bolt-cep Goto Github PK

Hi!
Is it possible to set the CEP panel persistent?

 var csInterface = new CSInterface();
 event = new CSEvent("com.adobe.PhotoshopPersistent", "APPLICATION");
 event.extensionId = csInterface.getExtensionID();
 csInterface.dispatchEvent(event);

I did with csi from utils.ts but it didn't work.
thanks!

I'm getting some errors when running monaco built with bolt-cep, which I believe is related to the file paths not being correctly fixed with the /assets prefix.

The issues seems to be caused by the require pollyfill being bound with the incorrect basedir in some cases. Not sure if this is something that falls within vite-cep-plugin to fix, or if it will come up in other repos.

Current issue

Repo link

When serving the built files, requests are being made to js assets that don't exist:

These files exist, but as expected are located in /assets. Following the stack track shows that the error is thrown in the getSynchXHR() function as a part of the require() polyfill inlined to index.html.

Following the function calls upwards, we can see that require is being called bound the to the root dirname, but without the assets/ prefix.

This call can be seen in the source files, where require() is called:

require("./typescript.80793909.js");

Originally I thought this was an issue that could be fixed at the require() call site, but then I realized there are other times when require() is bound to the correct /assets dirname:

And adding /assets to the require call means that these executions result in the incorrect path `"assets/assets/...".

Cause

The dirname arg is bound here:

Logging dirname show's how sometimes it contains /assets while other times it doesn't.

dirname is bound to the result of loadPrerequisites(). Still investigating why this is different across calls, considering baseDir only seems to be set once — to the base URL without /assets.

Temporary fix

I was able to work around the issue by adding the following if statement to the require implementation to make sure asset paths are prefixed with /assets.

function require(dirname, file) {
  file = typeof file === "string" ? file.trim() : "";
  if (!dirname.includes("/assets/")) {
    dirname = dirname + "assets/";
  }
  // ....

Which fixes the issue, but obviously isn't much of a solution! Let me know if you've run across anything similar, or if I've missed anything. Will continue investigating and see if I can work up a good fix.

Hey, I'm working on a plugin that requires using an app key (UUID like an app secret). that I'll be storing in my repository as a GitHub Secret so it's not committed to source. I want to use that key to connect to a service via REST APIs however, I can't seem to figure out how to incorporate that into the GitHub ZXP build action. Is there a recommended way of doing this? I'm not a novice to programming whatsoever, but I just don't understand how it works from the GitHub action perspective. Thanks!

I am on the 'yarn build' step and I cannot get the node 'path' module to be found no matter what I try, in the file vite.config.ts.
I tried require in this file, yet it still prints out the same error. "Cannot find path module in the file 'vite.config.ts'".
Wonder what I am doing wrong? The first few lines of this file are like this after my edit:

import react from "@vitejs/plugin-react";

import { cep } from "vite-cep-plugin";
import cepConfig from "./cep.config";
const path = require("path");
import { extendscriptConfig } from "./vite.es.config";```

Hi Team,

Firstly, thanks for putting this project together. It should accelerate my development massively.

Unfortunately I'm reasonably new to the various JS buid systems and also having some issues getting my project built for the first time.
If I create a new project using yarn create bolt-cep aud-zetta-panel --template react and then run yarn then yarn build the build fails with a number of errors (below)

Being new to this particular set of build systems, I'm not 100% sure on where to start. Any advice would be greatly recieved.

Thanks,
Alex

➜  aud-zetta-panel yarn
yarn install v1.22.19
info No lockfile found.
[1/4] 🔍  Resolving packages...
warning @rollup/plugin-commonjs > magic-string > [email protected]: Please use @jridgewell/sourcemap-codec instead
warning babel-preset-env > babel-plugin-transform-es2015-arrow-functions > babel-runtime > [email protected]: core-js@<3.23.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. Some versions have web compatibility issues. Please, upgrade your dependencies to the actual version of core-js.
[2/4] 🚚  Fetching packages...
[3/4] 🔗  Linking dependencies...
warning " > [email protected]" has unmet peer dependency "path@^0.12.7".
[4/4] 🔨  Building fresh packages...
success Saved lockfile.
✨  Done in 37.52s.
➜  aud-zetta-panel yarn build
yarn run v1.22.19
$ rimraf dist/* && tsc && vite build --watch false
src/js/lib/utils.ts:43:30 - error TS2307: Cannot find module '@esTypes/index' or its corresponding type declarations.

43 import type { Scripts } from "@esTypes/index";
                                ~~~~~~~~~~~~~~~~

src/js/lib/utils.ts:73:21 - error TS2344: Type 'Func' does not satisfy the constraint 'Function'.

73   ...args: ArgTypes<Func>
                       ~~~~

src/js/lib/utils.ts:74:23 - error TS2344: Type 'Func' does not satisfy the constraint 'Function'.

74 ): Promise<ReturnType<Func>> => {
                         ~~~~

src/js/main/main.tsx:34:24 - error TS2345: Argument of type 'string' is not assignable to parameter of type 'never'.

34     evalTS("helloStr", "test").then((res) => {
                          ~~~~~~

src/js/main/main.tsx:37:24 - error TS2345: Argument of type 'number' is not assignable to parameter of type 'never'.

37     evalTS("helloNum", 1000).then((res) => {
                          ~~~~

src/js/main/main.tsx:40:29 - error TS2345: Argument of type 'string[]' is not assignable to parameter of type 'never'.

40     evalTS("helloArrayStr", ["ddddd", "aaaaaa", "zzzzzzz"]).then((res) => {
                               ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/js/main/main.tsx:43:24 - error TS2345: Argument of type '{ height: number; width: number; }' is not assignable to parameter of type 'never'.

43     evalTS("helloObj", { height: 90, width: 100 }).then((res) => {
                          ~~~~~~~~~~~~~~~~~~~~~~~~~~

src/js/main/main.tsx:45:23 - error TS2339: Property 'x' does not exist on type 'never'.

45       console.log(res.x);
                         ~

src/js/main/main.tsx:46:23 - error TS2339: Property 'y' does not exist on type 'never'.

46       console.log(res.y);
                         ~

src/js/main/main.tsx:48:26 - error TS2345: Argument of type 'string' is not assignable to parameter of type 'never'.

48     evalTS("helloError", "test").catch((e) => {
                            ~~~~~~


Found 10 errors in 2 files.

Errors  Files
     3  src/js/lib/utils.ts:43
     7  src/js/main/main.tsx:34
error Command failed with exit code 2.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

We're getting an error when trying to create a new project, when running 'yarn build' we are getting:

error during build:
TypeError: (0 , import_vite_cep_plugin.jsxPonyfill) is not a function

It seems like it fail to import jsxPonyfill and it does work only if we remove this import and the call to the function.

Config CEP Panel Icons should be setup to be included by default.

CEP Panels have several types. Is there a way to specify the type of panel in cep.cponfig.ts? Bridge, for instance, supports Embedded panels. This sits in the DispatchInfoList -> Extension -> DispatchInfo -> UI -> Type tag in the manifest.

在yarn build的时候，发生以下错误，我该如何解决

Error: dlopen(/Users/chenhongwei/Desktop/devDemo/myApp/node_modules/jsxbin/esdebugger-core/mac/esdcorelibinterface.node, 0x0001): tried: '/Users/chenhongwei/Desktop/devDemo/myApp/node_modules/jsxbin/esdebugger-core/mac/esdcorelibinterface.node' (mach-o file, but is an incompatible architecture (have 'x86_64', need 'arm64e')), '/usr/local/lib/esdcorelibinterface.node' (no such file), '/usr/lib/esdcorelibinterface.node' (no such file)

I just created a new example project, following the below steps:

yarn create bolt-cep myApp --template react
yarn
yarn build
yarn serve

First I tried to go to http:/localhost:5000/main/ and got a Permission denied error.

This was remedied when I changed cep.config.ts:10 from servePort: 5000 to servePort: 3000 (apparently it conflicts with AirPlay? I'm on an M1 MacBook).

But then, when I went to

http:/localhost:3000/main/, I got a blank page:

It's not obvious to me if this is the intended result, but I would expect it to look like http:/localhost:3000/main/ after I run yarn dev, i.e.

Hello,

I just created a new example project, following the below steps:

yarn create bolt-cep myApp --template react
yarn
yarn dev

and went to http://localhost:3000/main/ which went fine:

But when I went to /settings/ and /panel they don't appear to exist:

To be clear, it's possible that the reason is because those pages aren't implemented yet. I'm still learning the React / TypeScript and it's not obvious to me if that's why.

I'm opening this issue because the documentation seems to imply that those pages should be there by default:

and they are not, at least not for me.

https://vitejs.dev/blog/announcing-vite4.html

When I run 'yarn build' the project is built successfully, and everything functions as expected.
However, when I run 'yarn zxp' and install that file, the extension does not work.
After some digging, I figured out that the zxp bundle did not include the same jsx folder and index.js file that the build, and manual install for the extension does.
My current workaround is dragging the jsx folder into the installed zxp, which works for now.
I'm not sure exactly where to begin on fixing this and haven't seen any similar issues in the repo.

Thank you!

What would be the recommended way to make the generated jsx/index.js less transparent?

jsx/index.js reveals:

• packages.json contents, including used dependencies, comments etc.
  setting treeshake: true in vite.es.config.ts solves this

• var config reveals entire cep.config.ts including ports - var ns only uses config.id, is there any reason for including the whole config here?
  javascript-obfuscator can be added to rollup to help with hiding this, though it would be better to avoid importing entire config object

• all JS functions that invoke JSX functions from index.jsxbin are here in their original form with comments etc.
  javascript-obfuscator can be added to rollup to help with hiding these

• same goes for the index.map.js
  sourcemap can be disabled by sourcemap: false, in vite.es.config.ts

• JSXBIN is 2.0 (instead of 2.1) but I guess we can't do much about it until the extendscript-jsxbin dependency gets updated?

Edit: added solutions I've found so far

Looks like this is a Windows/Mac line ending issue, but not sure exactly how to fix this.

yarn create bolt-cep my-app --template react
yarn create v1.22.17
[1/4] 🔍  Resolving packages...
[2/4] 🚚  Fetching packages...
[3/4] 🔗  Linking dependencies...
warning "create-bolt-cep > [email protected]" has unmet peer dependency "@types/node@*".
[4/4] 🔨  Building fresh packages...

success Installed "[email protected]" with binaries:
      - create-bolt-cep
env: node\r: No such file or directory
error Command failed.
Exit code: 127
Command: /Users/Martin/.yarn/bin/create-bolt-cep
Arguments: my-app --template react
Directory: /Users/Martin/dev
Output:

info Visit https://yarnpkg.com/en/docs/cli/create for documentation about this command.

compilerOptions.skipLibCheck in tsconfig.json is set to false by default and produces the below error for me on a fresh Vue build. Fixed by changing value to true to skip lib type checking.

PS C:\Users\TRSch\OneDrive\Documents\DEV\typo> yarn build
yarn run v1.22.18
$ rimraf dist/* && tsc && vite build --watch false
../node_modules/@types/inquirer/index.d.ts:80:76 - error TS2344: Type 'T' does not satisfy the constraint 'Answers'.

80 interface ListQuestionOptionsBase<T, TChoiceMap> extends inquirer.Question<T> {
                                                                              ~

  ../node_modules/@types/inquirer/index.d.ts:80:35
    80 interface ListQuestionOptionsBase<T, TChoiceMap> extends inquirer.Question<T> {
                                         ~
    This type parameter might need an `extends inquirer.Answers` constraint.

../node_modules/@types/inquirer/index.d.ts:84:91 - error TS2344: Type 'TChoiceMap' does not satisfy the constraint 'Answers'.

84     choices?: inquirer.AsyncDynamicQuestionProperty<ReadonlyArray<inquirer.DistinctChoice<TChoiceMap>>, T> | undefined;
                                                                                             ~~~~~~~~~~

  ../node_modules/@types/inquirer/index.d.ts:80:38
    80 interface ListQuestionOptionsBase<T, TChoiceMap> extends inquirer.Question<T> {
                                            ~~~~~~~~~~
    This type parameter might need an `extends inquirer.Answers` constraint.

../node_modules/@types/inquirer/index.d.ts:84:105 - error TS2344: Type 'T' does not satisfy the constraint 'Answers'.

84     choices?: inquirer.AsyncDynamicQuestionProperty<ReadonlyArray<inquirer.DistinctChoice<TChoiceMap>>, T> | undefined;
                                                                                                           ~

  ../node_modules/@types/inquirer/index.d.ts:80:35
    80 interface ListQuestionOptionsBase<T, TChoiceMap> extends inquirer.Question<T> {
                                         ~
    This type parameter might need an `extends inquirer.Answers` constraint.

../node_modules/@types/inquirer/lib/objects/choices.d.ts:11:39 - error TS2344: Type 'T' does not satisfy the constraint 'Answers'.

11 type DistinctChoice<T> = AllChoiceMap<T>[keyof AllChoiceMap<T>];
                                         ~

  ../node_modules/@types/inquirer/lib/objects/choices.d.ts:11:21
    11 type DistinctChoice<T> = AllChoiceMap<T>[keyof AllChoiceMap<T>];
    This type parameter might need an `extends Answers` constraint.

../node_modules/@types/inquirer/lib/objects/choices.d.ts:11:61 - error TS2344: Type 'T' does not satisfy the constraint 'Answers'.

11 type DistinctChoice<T> = AllChoiceMap<T>[keyof AllChoiceMap<T>];
                                                               ~

  ../node_modules/@types/inquirer/lib/objects/choices.d.ts:11:21
    11 type DistinctChoice<T> = AllChoiceMap<T>[keyof AllChoiceMap<T>];
                           ~
    This type parameter might need an `extends Answers` constraint.


Found 5 errors in 2 files.

Errors  Files
     3  ../node_modules/@types/inquirer/index.d.ts:80
     2  ../node_modules/@types/inquirer/lib/objects/choices.d.ts:11
error Command failed with exit code 2.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Hello Hyper Brew-

I'm a noob programmer. I've downloaded your bolt-cep on my iMac and I was wondering if there is a short beginner's guide you can direct me to. I've unzipped the file, but every time I try to install npm, I get dependencies errors for the RollUp dependency. Has anyone else reported this or do most people know workarounds? Am I using a wrong version of npm??? I'm just really not sure where to find the answers. Could you point me in the right direction? Thank you.

When creating an extension, it is possible to include multiple panels, which you do in the skeleton (thanks for that!). Since CEP is intended to support multiple host applications, it is common for an extension to include panels that appear only in specific applications but not in others. For instance, we produce an Embedded panel that is tied to the "KBRG" host (Bridge,) while all other applications use a Panel that has no host attribute.

This attribute can be added in cep-config.d.ts, and will need to be parsed by your build command to include the tag in the manifest.

export interface CEP_Panel {
    mainPath: string;
    name: string;
    panelDisplayName?: string | null;
    autoVisible: boolean;
    width?: number;
    height?: number;
    maxWidth?: number;
    maxHeight?: number;
    minWidth?: number;
    minHeight?: number;
    scriptPath?: string;
    type?: CEP_Panel_Type;
    **host?: string;**
    id?: string;
    iconDarkNormal?: string;
    iconNormal?: string;
    iconDarkNormalRollOver?: string;
    iconNormalRollOver?: string;
    parameters?: CEF_Command[];
    startOnEvents?: string[];
}

Hey @justintaylor-dev, I wanted to see how you did the ES6 support for Extendscript and noticed that ES6 array functions don't get ponyfilled. Haven't checked any other ES6 features.

Input

export const helloWorld = () => {
  const x = ['hello', 'from', 'ae']
  x.forEach((e) => alert(e))
  x.map((e) => `${e}gibberish`)
};

Output

var r = function() {
  var e = [ "hello", "from", "ae" ];
  e.forEach(function(e) {
      return alert(e);
  });
  e.map(function(e) {
      return "".concat(e, "gibberish");
  });
};

Unfortunetly, babel (purposefully) transpiles array destructuring into code that uses Array.isArray, even if that's not available in the target environment.

More info in this issue on the babel repo:
babel/babel#11195

Don't expect a fix or anything, just wanted to call it out in case you hadn't run across it and wanted to call it out as a known limiation in the README or something.

I've just replaced the destructuring in my scripts manually.

Appreciate your hard work! Feel free to close without comment :)

typo in package.json, line 5
vite --mode developemnt

Edit: actually not sure if this is coming from Bolt or Vite addon

The template injects the following parameters:

<CEFCommandLine>
  <Parameter>--v=0</Parameter>
  <Parameter>--enable-nodejs</Parameter>
  <Parameter>--mixed-context</Parameter>
</CEFCommandLine>

These parameters are customizable per CEP Cookbook. We would like to remove --v=0 and add --enable-file-cookies as well as other parameters.

hello!
When I was running the command yarn zxp I was receiving an error about certificate file is not valid.
Then I discovered that this issue is caused by the root name path of the project , for instance if you clone the repo in a folder named : "c:/users/documents/Post production/bolt-cep"

Then I renamed the folder name without any space between Post-production and everything is running fine.

I'm trying to save cache data for the extension when it's closed. I've put this snippet in index.tsx, but it doesn't seem to be working.
Usually, I guess you'd put it inside the html file surrounded with a script tag or something. But in the context of React and Vite, I just don't know how I'd add the onClose callback

cep.util.registerExtensionUnloadCallback(function() {
    cep.fs.writeFile("C:/Users/me/Desktop/appChache.txt", "app closed");
});

Thank you

Impossible to run dev in Mac OSX 12.3.1

>main: http://localhost:3000/main/

  vite v2.9.1 dev server running at:

  > Local: http://localhost:3000/
  > Network: use `--host` to expose

  ready in 530ms.

JSXBIN Created: index.jsxbin
ExtendScript Change
11:37:47 AM [vite] page reload main/index.html
11:37:48 AM [vite] Internal server error: Cannot convert undefined or null to object
      at Function.keys (<anonymous>)

After I installed chakra-ui , the npm run build cmd showed above error.
It's a simple hello world code.
It worked for sometime initially, but after sometime HMR stopped.
And when I stopped the npm run dev, and tried to run npm run build , it showed above error.

I can't create a new project via

yarn create bolt-cep ceptest -t skeleton -f react -a ppro -p com.ceptest.cep -n CEPTest

Getting the following error output:

┌   create-bolt-cep
│   by Hyper Brew | https://hyperbrew.co
│
◇  Inputs ─────────────────────────────────────────────────────────────────╮
│                                                                          │
│  panel      ceptest (CEPTest)                                            │
│  id         com.ceptest.cep                                              │
│  framework  React                                                        │
│  template   Skeleton (only selected apps and no sample UI or functions)  │
│  apps       Premiere Pro                                                 │
│                                                                          │
├──────────────────────────────────────────────────────────────────────────╯
│
○  Installing bolt-cep
/private/var/folders/bc/rqk94w6s5gvg1hfcwfr6y9rw0000gn/T/xfs-afe1ee1a/dlx-75288/.pnp.cjs:1853
  return Object.assign(new Error(`${code}: ${message}`), { code });
                       ^

Error: ENOENT: no such file or directory, lstat '/node_modules/bolt-cep'
    at makeError$1 (/private/var/folders/bc/rqk94w6s5gvg1hfcwfr6y9rw0000gn/T/xfs-afe1ee1a/dlx-75288/.pnp.cjs:1853:24)
    at ENOENT (/private/var/folders/bc/rqk94w6s5gvg1hfcwfr6y9rw0000gn/T/xfs-afe1ee1a/dlx-75288/.pnp.cjs:1868:10)
    at ZipFS.lstatSync (/private/var/folders/bc/rqk94w6s5gvg1hfcwfr6y9rw0000gn/T/xfs-afe1ee1a/dlx-75288/.pnp.cjs:3325:13)
    at /private/var/folders/bc/rqk94w6s5gvg1hfcwfr6y9rw0000gn/T/xfs-afe1ee1a/dlx-75288/.pnp.cjs:4624:20
    at /private/var/folders/bc/rqk94w6s5gvg1hfcwfr6y9rw0000gn/T/xfs-afe1ee1a/dlx-75288/.pnp.cjs:5046:60
    at ZipOpenFS.getZipSync (/private/var/folders/bc/rqk94w6s5gvg1hfcwfr6y9rw0000gn/T/xfs-afe1ee1a/dlx-75288/.pnp.cjs:5175:14)
    at ZipOpenFS.makeCallSync (/private/var/folders/bc/rqk94w6s5gvg1hfcwfr6y9rw0000gn/T/xfs-afe1ee1a/dlx-75288/.pnp.cjs:5046:17)
    at ZipOpenFS.lstatSync (/private/var/folders/bc/rqk94w6s5gvg1hfcwfr6y9rw0000gn/T/xfs-afe1ee1a/dlx-75288/.pnp.cjs:4621:17)
    at VirtualFS.lstatSync (/private/var/folders/bc/rqk94w6s5gvg1hfcwfr6y9rw0000gn/T/xfs-afe1ee1a/dlx-75288/.pnp.cjs:4073:24)
    at PosixFS.lstatSync (/private/var/folders/bc/rqk94w6s5gvg1hfcwfr6y9rw0000gn/T/xfs-afe1ee1a/dlx-75288/.pnp.cjs:4073:24) {
  code: 'ENOENT'
}

Node.js v18.15.0

I'm on macOS 13.2.1 on an Intel Mac.

Thanks a lot!

adding draggable="true" to an HTML element inside a CEP panel doesn't seem to have any effect.

Anyone here knows how this works?

Adobe CEP docs states that it is supported.

Thanks!

I've tried this with multiple builds but after a while of development I start to get this error alert "TypeError: undefined is not an object" whenever I try to run an evalEs function. Even when I revert back to the template jsxTest function.

Hi,
I've tried to install it but I got an error that says [email protected]: The platform "linux" is incompatible with this module.
How can I run the application inside Ubuntu 22?

I'm trying to build an extension that has the capability to screen share. While the popup for selecting the screen to be shared appears when I'm in development mode and on the browser, it doesn't show up after building the extension and opening it on Premiere Pro. Does Premiere Pro not allow such popups and is there a way to make this work?

On browser:

On extension:

Sorry if this is more of a support request than an issue report, but:
I cannot figure out how to get custom environment variables into a Bolt extension.
I've tried with VITE_* variables in .env and import.meta.VITE_* according to Vite's docs, and with the React script approach(which I didn't really expect to work). Should either of these work? And if not, what's the best way to get variables into a Bolt extension at build time?

I've been using a slightly different evalES function in my own repo, proving nice autocompletion and type-safety between the scripts and calling them in the UI.

Current experience

Currently it's typed here as:

type evalES = (script: string, isGlobal: boolean) => Promise<string>;

And used something like:

evalES(`scriptName(booleanArg, '${stringArg}')`);

Proposed

In my own project, I implemented a custom function that works in the same way, but with a slightly different api and some nicer typings.

TypeScript playground example

import * as scripts from "../jsx";

type evalES<T extends keyof typeof scripts> = (
  scriptName: T,
  ...args: Parameters<typeof scripts[T]>
) => Promise<string>;

Usage

evalES("scriptName", booleanArg, stringArg);

This way you end up with type-safety between ExtendScript and the UI. I also prefer passing the arguments in as values rather than building the string everytime, which helps things wrap nicely in the editor.

Issues

This works fine for me, since I'm only targeting one program (aeft), so there's only one set of scripts. Would need to work out the best way to get this working for mutli-program setups, open to ideas! But will try some things out 👍

Let me know what you think!

Will work up a proper pull request with an implementation soon (if you think it's a good idea) :)

Hello i tried to run the cep extension, however i get:
Which version of yarn should be used?
Currently on Yarn 3.2.0, Mac M1

steps to reproduce

1. clone
2. yarn
3. yarn build

bolt-cep % yarn buld
Usage Error: Couldn't find a script named "build".

$ yarn run [--inspect] [--inspect-brk] [-T,--top-level] [-B,--binaries-only] <scriptName> ...
saulpalv@mac bolt-cep % yarn build
No matches found: "dist/*"

i will try with yarn 1...

Hi, I'm on an M1 Mac.

I just created a new example project, following the below steps:

yarn create bolt-cep myApp --template react
yarn
yarn build

and then when I ran yarn zxp, I got

I also tried sudo yarn zxp and got the same error.

Hello,

I'm trying the package out, and all in all it looks great! I might be missing something obvious here, but...

I did the first build and it says symlinks already exist - but they do not show up in my extensions folder. I also am not really sure what local and global means on the config file. I've tried both. Tried manually creating soft links to the extensions folder too and Premiere didn't recognize it.

➜  premiere-otio git:(master) ✗ sudo yarn build
Password:
yarn run v1.22.18
$ rimraf dist/* && tsc && vite build --watch false
dist/cep/jsx/index.js
vite v2.9.8 building for production...
✓ 19 modules transformed.
JSXBIN Created: index.jsxbin
rendering chunks (1)...cep process: build
manifest created → succeeded √  
debug file created → succeeded √  
symlink already exists → succeeded √  

Copying 0 Node Module(s) (0 Dependencies) : 
Copying 0 Assets
FINISH
../../dist/cep/assets/node-js.b824f758.svg   1.22 KiB
../../dist/cep/assets/adobe.96d52626.svg     0.30 KiB
../../dist/cep/CSXS/manifest.xml             1.66 KiB
../../dist/cep/.debug                        0.27 KiB
../../dist/cep/main/index.html               3.91 KiB
../../dist/cep/assets/main.d20a4f1a.css      1.16 KiB / gzip: 0.59 KiB
../../dist/cep/assets/main.80cf16b2.js       59.54 KiB / gzip: 23.13 KiB
../../dist/cep/assets/main.80cf16b2.js.map   609.38 KiB
✨  Done in 7.26s.

➜  premiere-otio git:(master) ✗ ls -a dist/cep 
.            ..           .debug       CSXS         assets       jsx          main         node_modules

➜  premiere-otio git:(master) ✗ ls -a "/Library/Application Support/Adobe/CEP/extensions" 
.                                     CC_LIBRARIES_PANEL_EXTENSION_3_13_164 CC_LIBRARIES_PANEL_EXTENSION_3_8_299  com.adobe.ccx.start-2.16.0
..                                    CC_LIBRARIES_PANEL_EXTENSION_3_19_218 com.adobe.ccx.fnft-3.5.0              com.adobe.ccx.start-2.7.2

1. We want to be able to specify that the XML is standalone. Currently, the template sets the value to "no."
2. When making extensions with panels with host-specific versions, there should be only one entry in per extension ID. Bolt-CEP makes one entry per panel.

It works well in AE2020 PR2020,

but in PR/AE 21 & 22, I click "window -> bolt cep", nothing happen,

(use vue template)

I try to change the CSXS version, not work either

Thank you so much, this project is so useful

Today, when I was developing the pr extension, I found that I saved the local file without restarting pr, and the extension was actually restarted, and I modified the jsx file, which also took effect

Before that, I was building now, and then put it in the pr extension folder,

But when I restart vscode, it suddenly fails. What is the normal debugging and expansion process? How can I reload CEP panel extension and its ExtendScript without restarting?

Is it possible at all to use ESM modules that use the node runtime? (e.g. tempy)

The approaches mentioned in the troubleshooting section fail in different ways, and I even tried exporting the import() function which made the entire CEP process crash.

Using import syntax with tempy, building fails with:

"promisify" is not exported by "__vite-browser-external", imported by "node_modules/tempy/index.js".
file: /Users/krhah771/code/esmtest/node_modules/tempy/index.js:5:8
3: import path from 'node:path';
4: import stream from 'node:stream';
5: import {promisify} from 'node:util';
           ^
6: import uniqueString from 'unique-string';
7: import tempDir from 'temp-dir';
error during build:
RollupError: "promisify" is not exported by "__vite-browser-external", imported by "node_modules/tempy/index.js".
    at error (file:///Users/krhah771/code/esmtest/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:2095:30)
    at Module.error (file:///Users/krhah771/code/esmtest/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:13145:16)
    at Module.traceVariable (file:///Users/krhah771/code/esmtest/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:13530:29)
    at ModuleScope.findVariable (file:///Users/krhah771/code/esmtest/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:12009:39)
    at Identifier.bind (file:///Users/krhah771/code/esmtest/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:7921:40)
    at CallExpression.bind (file:///Users/krhah771/code/esmtest/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:5716:23)
    at CallExpression.bind (file:///Users/krhah771/code/esmtest/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:9458:15)
    at VariableDeclarator.bind (file:///Users/krhah771/code/esmtest/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:5716:23)
    at VariableDeclaration.bind (file:///Users/krhah771/code/esmtest/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:5712:28)
    at Program.bind (file:///Users/krhah771/code/esmtest/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:5712:28)
    at Module.bindReferences (file:///Users/krhah771/code/esmtest/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:13141:18)
    at Graph.sortModules (file:///Users/krhah771/code/esmtest/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:24480:20)
    at Graph.build (file:///Users/krhah771/code/esmtest/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:24364:14)
    at async file:///Users/krhah771/code/esmtest/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:25376:13
    at async catchUnfinishedHookActions (file:///Users/krhah771/code/esmtest/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:24534:20)
    at async rollupInternal (file:///Users/krhah771/code/esmtest/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:25371:5)
    at async build (file:///Users/krhah771/code/esmtest/node_modules/vite/dist/node/chunks/dep-ca21228b.js:44664:18)
    at async CAC.<anonymous> (file:///Users/krhah771/code/esmtest/node_modules/vite/dist/node/cli.js:813:9)

Using request syntax, the panel throws up this:

Uncaught Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: /Users/krhah771/code/esmtest/dist/cep/node_modules/tempy/index.js
require() of ES modules is not supported.
require() of /Users/krhah771/code/esmtest/dist/cep/node_modules/tempy/index.js from /main/index.html is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules.
Instead rename index.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from /Users/krhah771/code/esmtest/dist/cep/node_modules/tempy/package.json.

    at __node_internal_captureLargerStackTrace (node:internal/errors:415:5)
    at __node_internal_addCodeToName (node:internal/errors:168:9)
    at new NodeError (node:internal/errors:329:5)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1138:13)
    at Module.load (node:internal/modules/cjs/loader:995:32)
    at Function.Module._load (node:internal/modules/cjs/loader:836:14)
    at Module.require (node:internal/modules/cjs/loader:1019:19)
    at require (node:internal/modules/cjs/helpers:92:18)
    at http://localhost:3000/main/main.tsx:27:15

I tried everything, I put it in installModules in the config, I tried require, I tried import, I tried using plugins, I tried using everything, it's just not working, please help I'm on a deadline

In dev mode, when the src/jsx/index.ts file is modified, any ES includes are duplicated.

After running yarn build, the extension builds fine and seems to place everything where it should but for all my fonts and SVG files that have to be loaded in via CSS, I get the following error in the browser console:

index.html:52 GET file:///C:/assets/WebFontOrSVG.ext net::ERR_FILE_NOT_FOUND

This occurs for all assets that are linked inside of CSS files. The filepath for these assets becomes prefixed with the root of the filesystem, so the C:/ drive for Windows machines and / for MacOS.

This doesn't occur if I run yarn dev and load the extension in the development mode.

The reason for this is that in the final compiled CSS file inside of dist/js, all paths to external files are prefixed with '/assets/' when they should be prefixed with './'

Running a search and replace to replace all occurrences of '/assets/' with './' inside of the final merged and minified CSS file acts as a workaround for this issue.

When installed, this extension is throwing errors on a fresh install of the repo.

https://marketplace.visualstudio.com/items?itemName=ms-vscode.vscode-typescript-next

The error appears in the tsconfg.json within the jsx folder.

This can be easily prevented by not using the above extension.