Error when creating UI App Extension

[whoacowboy]

What happened?

I went through the process of installing an ui app-extension and i receive the error ReferenceError: aeCodeFormat is not defined.

I was able to install an app and a plain app-extension without issue.

I uninstalled and reinstalled node, npm, yarn, @quasar/cli .

The error is on install so I do not have a reproduction.

What did you expect to happen?

I was really hoping it would install a UI App extension.

Reproduction URL

https://codepen.io/whoacowboy/pen/zxOKVNO/1f66c7abbd429e2e0cbbb26d56588a0f

How to reproduce?

Just go through the install process.

Flavour

Quasar CLI with Webpack (@quasar/cli | @quasar/app-webpack)

Areas

App Extension API

Platforms/Browsers

Firefox

Quasar info output

Operating System   	Darwin(23.6.0) - darwin/arm64
NodeJs             	20.11.0

Global packages
  NPM              	10.2.4
  yarn             	1.22.22
  pnpm             	Not installed
  bun              	Not installed
  @quasar/cli      	2.4.1
  @quasar/icongenie	Not installed
  cordova          	Not installed

Relevant log output

james@Jamess-Mac-Studio fe % yarn create quasar
yarn create v1.22.22
[1/4] 🔍  Resolving packages...
[2/4] 🚚  Fetching packages...
[3/4] 🔗  Linking dependencies...
[4/4] 🔨  Building fresh packages...
success Installed "[email protected]" with binaries:
      - create-quasar
[############################################################################################################################################] 267/267

 .d88888b.
d88P" "Y88b
888     888
888     888 888  888  8888b.  .d8888b   8888b.  888d888
888     888 888  888     "88b 88K          "88b 888P"
888 Y8b 888 888  888 .d888888 "Y8888b. .d888888 888
Y88b.Y8b88P Y88b 888 888  888      X88 888  888 888
 "Y888888"   "Y88888 "Y888888  88888P' "Y888888 888
       Y8b

✔ What would you like to build? › Quasar UI kit
✔ Project folder: … quasar-project
✔ Target directory "quasar-project" is not empty. Remove existing files and continue? … yes
✔ Pick Quasar version: › Quasar v2 (Vue 3 | latest and greatest)
✔ Project name (npm name, kebab-case, without "quasar-ui" prefix) … new-compenent
✔ License type … MIT
✔ Pick what you will be interested in: › Vue component, Quasar App Extension
✔ Package description … My great thing
✔ UMD export name (global variable, camelCased) … newComponent
✔ Component name (PascalCase) … NewComponent
✔ App Extension description … A great thing
✔ Pick the needed App Extension scripts: › Install script, Uninstall script

 Quasar • Generating files...

 - LICENSE
 - README.md
 - .gitignore
 - jsconfig.json
 - ui/README.md
 - ui/.npmignore
 - ui/package.json
 - ui/build/config.js
 - ui/build/index.js
 - ui/build/script.clean.js
 - ui/build/script.css.js
 - ui/build/script.javascript.js
 - ui/build/script.open-umd.js
 - ui/build/utils.js
 - ui/dev/README.md
 - ui/dev/.editorconfig
 - ui/dev/.gitignore
 - ui/dev/.postcssrc.js
 - ui/dev/package.json
 - ui/dev/babel.config.js
 - ui/dev/quasar.config.js
 - ui/dev/src/App.vue
 - ui/dev/src/assets/.gitkeep
 - ui/dev/src/boot/register.js
 - ui/dev/src/components/.gitkeep
 - ui/dev/src/css/app.sass
 - ui/dev/src/css/quasar.variables.sass
 - ui/dev/src/index.template.html
 - ui/dev/src/layouts/MyLayout.vue
 - ui/dev/src/pages/Error404.vue
 - ui/dev/src/pages/Index.vue
 - ui/dev/src/pages/Test1.vue
 - ui/dev/src/router/index.js
 - ui/dev/src/router/pages.js
 - ui/dev/src/router/routes.js
 - ui/src/index.common.js
 - ui/src/index.esm.js
 - ui/src/index.sass
 - ui/src/index.umd.js
 - ui/src/vue-plugin.js
 - ui/umd-test.html
 - app-extension/README.md
 - app-extension/.npmignore
 - app-extension/package.json
undefined:16
((__t = ( aeCodeFormat === 'esm' ? 'module' : 'commonjs' )) == null ? '' : __t) +
          ^

ReferenceError: aeCodeFormat is not defined
    at eval (eval at <anonymous> (/Users/james/.config/yarn/global/node_modules/lodash/template.js:259:12), <anonymous>:16:11)
    at Object.renderTemplate (file:///Users/james/.config/yarn/global/node_modules/create-quasar/utils/index.js:94:24)
    at script (file:///Users/james/.config/yarn/global/node_modules/create-quasar/templates/ui-kit/quasar-v2/index.js:6:11)
    at script (file:///Users/james/.config/yarn/global/node_modules/create-quasar/templates/ui-kit/index.js:114:9)
    at async file:///Users/james/.config/yarn/global/node_modules/create-quasar/index.js:79:1

Node.js v20.11.0
error Command failed.
Exit code: 1
Command: /Users/james/.yarn/bin/create-quasar
Arguments:
Directory: /Users/james/Code/consumer/fe
Output:

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

Additional context

No response

[github-actions]

Hi @whoacowboy! 👋

It looks like you provided an invalid or unsupported reproduction URL.
Do not use any service other than Codepen, jsFiddle, StackBlitz, Codesandbox, and GitHub.
Make sure the URL you provided is correct and reachable. You can test it by visiting it in a private tab, another device, etc.
Please edit your original post above and provide a valid reproduction URL as explained.

Without a proper reproduction, your issue will have to get closed.

Thank you for your collaboration. 👏

[whoacowboy]

https://codepen.io/whoacowboy/pen/zxOKVNO/1f66c7abbd429e2e0cbbb26d56588a0f

It's an issue with the CLI

[rstoenescu]

Thanks for reporting! Fixed it.