create-quasar 2.1.0 → 2.1.1

package/templates/app-extension/ae-js/{index.js → create-quasar-script.js}

@@ -1,4 +1,4 @@
-export async function script ({ scope, utils }) {
+export async function createQuasarScript({ scope, utils }) {
   await utils.prompts(scope, [
     {
       type: 'confirm',
@@ -16,8 +16,9 @@ export async function script ({ scope, utils }) {
     {
       type: 'text',
       name: 'name',
-      message: 'Quasar App Extension ext-id (without "quasar-app-extension" prefix), eg. "my-ext"',
-      validate: (val) =>
+      message:
+        'Quasar App Extension ext-id (without "quasar-app-extension" prefix), eg. "my-ext"',
+      validate: val =>
         utils.isValidPackageName(val) || 'Invalid App Extension name'
     },
 
@@ -27,7 +28,11 @@ export async function script ({ scope, utils }) {
       message: 'Pick AE code format:',
       initial: 0,
       choices: [
-        { title: 'ESM (q/app-vite >= 1.5, q/app-webpack >= 3.10)', value: 'esm', description: 'recommended' },
+        {
+          title: 'ESM (q/app-vite >= 1.5, q/app-webpack >= 3.10)',
+          value: 'esm',
+          description: 'recommended'
+        },
         { title: 'CommonJS', value: 'commonjs' }
       ]
     },

package/templates/app-extension/ae-ts/BASE/_eslint.config.js

@@ -1,11 +1,12 @@
 import eslint from '@eslint/js';
-import tseslint from 'typescript-eslint';
+import { defineConfig } from 'eslint/config';
 import pluginVue from 'eslint-plugin-vue';
 import configPrettier from 'eslint-config-prettier';
 import globals from 'globals';
+import tseslint from 'typescript-eslint';
 import { version as vueVersion } from 'vue';
 
-export default tseslint.config(
+export default defineConfig(
   {
     name: 'eslint/recommended',
     ...eslint.configs.recommended,

package/templates/app-extension/ae-ts/BASE/_package.json

@@ -24,11 +24,11 @@
     "format:root": "prettier --write \"./*.{json,md,vue,js,ts,yml}\" \"./.vscode/*.json\" --ignore-path .gitignore"
   },
   "devDependencies": {
-    "@eslint/js": "^9.8.0",
+    "@eslint/js": "^9.39.4",
     "@types/eslint": "^9.6.0",
     "@types/eslint__js": "^8.42.3",
     "@types/node": "^20.12.8",
-    "eslint": "^10.0.3",
+    "eslint": "^9.39.4",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-vue": "^9.27.0",
     "globals": "^17.4.0",

package/templates/app-extension/ae-ts/BASE/playground/quasar-cli-vite/quasar.config.ts

@@ -1,5 +1,3 @@
-/* eslint-env node */
-
 // Configuration for your app
 // https://v2.quasar.dev/quasar-cli-vite/quasar-config-js
 

package/templates/app-extension/ae-ts/BASE/playground/quasar-cli-webpack/quasar.config.ts

@@ -1,5 +1,3 @@
-/* eslint-env node */
-
 // Configuration for your app
 // https://v2.quasar.dev/quasar-cli-webpack/quasar-config-js
 

package/templates/app-extension/ae-ts/{index.js → create-quasar-script.js}

@@ -1,4 +1,4 @@
-export async function script ({ scope, utils }) {
+export async function createQuasarScript({ scope, utils }) {
   await utils.prompts(scope, [
     {
       type: 'confirm',
@@ -16,12 +16,13 @@ export async function script ({ scope, utils }) {
     {
       type: 'text',
       name: 'name',
-      message: 'Quasar App Extension ext-id (without "quasar-app-extension" prefix), eg. "my-ext"',
-      validate: (val) =>
+      message:
+        'Quasar App Extension ext-id (without "quasar-app-extension" prefix), eg. "my-ext"',
+      validate: val =>
         utils.isValidPackageName(val) || 'Invalid App Extension name'
     },
 
-    utils.commonPrompts.description,
+    utils.commonPrompts.description
   ])
 
   await utils.injectAuthor(scope)
@@ -55,10 +56,14 @@ export async function script ({ scope, utils }) {
     }
   ])
 
-  scope.pkgName = scope.needOrgName ? `@${scope.orgName}/quasar-app-extension-${scope.name}` : `quasar-app-extension-${scope.name}`
+  scope.pkgName = scope.needOrgName
+    ? `@${scope.orgName}/quasar-app-extension-${scope.name}`
+    : `quasar-app-extension-${scope.name}`
   const packageManager = utils.runningPackageManager
   scope.packageManager = packageManager
-  scope.packageManagerField = packageManager ? `${packageManager.name}@${packageManager.version}` : undefined
+  scope.packageManagerField = packageManager
+    ? `${packageManager.name}@${packageManager.version}`
+    : void 0
 
   utils.createTargetDir(scope)
   utils.renderTemplate('BASE', scope)

package/templates/app-extension/create-quasar-script.js

@@ -0,0 +1,16 @@
+export async function createQuasarScript({ scope, utils }) {
+  /**
+   * Temporarily disable scriptType prompt (TS not ready yet)
+   */
+
+  // await utils.prompts(scope, [
+  //   utils.commonPrompts.scriptType
+  // ])
+
+  // const { createQuasarScript: create } = await import(`./ae-${ scope.scriptType }/create-quasar-script.js`)
+  // await create({ scope, utils })
+
+  const { createQuasarScript: create } =
+    await import('./ae-js/create-quasar-script.js')
+  await create({ scope, utils })
+}

package/templates/ui-kit/{eslint.config.js → __eslint.config.js}

@@ -1,8 +1,8 @@
+import { defineConfig } from 'eslint/config'
 import globals from 'globals'
-import tseslint from 'typescript-eslint'
 import baseConfig from '../eslint.config.base.js'
 
-export default tseslint.config(
+export default defineConfig(
   ...baseConfig,
 
   {

package/templates/ui-kit/{index.js → create-quasar-script.js}

@@ -1,10 +1,11 @@
-export async function script ({ scope, utils }) {
+export async function createQuasarScript({ scope, utils }) {
   await utils.prompts(scope, [
     {
       type: 'text',
       name: 'name',
-      message: 'Project name (npm name, kebab-case, without "quasar-ui" prefix)',
-      validate: (val) =>
+      message:
+        'Project name (npm name, kebab-case, without "quasar-ui" prefix)',
+      validate: val =>
         utils.isValidPackageName(val) || 'Invalid package.json name'
     }
   ])
@@ -97,8 +98,10 @@ export async function script ({ scope, utils }) {
     }
   ])
 
-  const { script } = await import(`./quasar-v2/index.js`)
-  await script({ scope, utils })
+  const { createQuasarScript: create } = await import(
+    `./quasar-v2/create-quasar-script.js`
+  )
+  create({ scope, utils })
 
   // we don't want to install
   scope.skipDepsInstall = true

package/templates/ui-kit/quasar-v2/{index.js → create-quasar-script.js}

@@ -1,4 +1,4 @@
-export async function script ({ scope, utils }) {
+export function createQuasarScript({ scope, utils }) {
   utils.createTargetDir(scope)
   utils.renderTemplate('BASE', scope)
 
@@ -12,7 +12,10 @@ export async function script ({ scope, utils }) {
   if (scope.features.component) utils.renderTemplate('ui-component', scope)
   if (scope.features.directive) utils.renderTemplate('ui-directive', scope)
 
-  if (scope.features.ae && (scope.features.component || scope.features.directive)) {
+  if (
+    scope.features.ae &&
+    (scope.features.component || scope.features.directive)
+  ) {
     utils.renderTemplate('ui-ae', scope)
   }
 }

package/test-project/.editorconfig

@@ -0,0 +1,7 @@
+[*.{js,jsx,mjs,cjs,ts,tsx,mts,cts,vue}]
+charset = utf-8
+indent_size = 2
+indent_style = space
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true

package/test-project/.prettierrc.json

@@ -0,0 +1,5 @@
+{
+  "$schema": "https://json.schemastore.org/prettierrc",
+  "singleQuote": true,
+  "printWidth": 100
+}

package/test-project/.vscode/extensions.json

@@ -0,0 +1,15 @@
+{
+  "recommendations": [
+    "dbaeumer.vscode-eslint",
+    "esbenp.prettier-vscode",
+    "editorconfig.editorconfig",
+    "vue.volar",
+    "wayou.vscode-todo-highlight"
+  ],
+  "unwantedRecommendations": [
+    "octref.vetur",
+    "hookyqr.beautify",
+    "dbaeumer.jshint",
+    "ms-vscode.vscode-typescript-tslint-plugin"
+  ]
+}

package/test-project/.vscode/settings.json

@@ -0,0 +1,9 @@
+{
+  "editor.bracketPairColorization.enabled": true,
+  "editor.guides.bracketPairs": true,
+  "editor.formatOnSave": true,
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "editor.codeActionsOnSave": ["source.fixAll.eslint"],
+  "eslint.validate": ["javascript", "javascriptreact", "typescript", "vue"],
+  "typescript.tsdk": "node_modules/typescript/lib"
+}

package/test-project/README.md

@@ -0,0 +1,43 @@
+# Quasar App (test-project)
+
+A Quasar Project
+
+## Install the dependencies
+
+```bash
+yarn
+# or
+npm install
+```
+
+### Start the app in development mode (hot-code reloading, error reporting, etc.)
+
+```bash
+quasar dev
+```
+
+### Lint the files
+
+```bash
+yarn lint
+# or
+npm run lint
+```
+
+### Format the files
+
+```bash
+yarn format
+# or
+npm run format
+```
+
+### Build the app for production
+
+```bash
+quasar build
+```
+
+### Customize the configuration
+
+See [Configuring quasar.config.js](https://v2.quasar.dev/quasar-cli-vite/quasar-config-js).

package/test-project/eslint.config.js

@@ -0,0 +1,83 @@
+import js from '@eslint/js';
+import globals from 'globals';
+import pluginVue from 'eslint-plugin-vue';
+import pluginQuasar from '@quasar/app-vite/eslint';
+import { defineConfigWithVueTs, vueTsConfigs } from '@vue/eslint-config-typescript';
+import prettierSkipFormatting from '@vue/eslint-config-prettier/skip-formatting';
+
+export default defineConfigWithVueTs(
+  {
+    /**
+     * Ignore the following files.
+     * Please note that pluginQuasar.configs.recommended() already ignores
+     * the "node_modules" folder for you (and all other Quasar project
+     * relevant folders and files).
+     *
+     * ESLint requires "ignores" key to be the only one in this object
+     */
+    // ignores: []
+  },
+
+  pluginQuasar.configs.recommended(),
+  js.configs.recommended,
+
+  /**
+   * https://eslint.vuejs.org
+   *
+   * pluginVue.configs.base
+   *   -> Settings and rules to enable correct ESLint parsing.
+   * pluginVue.configs[ 'flat/essential']
+   *   -> base, plus rules to prevent errors or unintended behavior.
+   * pluginVue.configs["flat/strongly-recommended"]
+   *   -> Above, plus rules to considerably improve code readability and/or dev experience.
+   * pluginVue.configs["flat/recommended"]
+   *   -> Above, plus rules to enforce subjective community defaults to ensure consistency.
+   */
+  pluginVue.configs['flat/essential'],
+
+  {
+    files: ['**/*.ts', '**/*.vue'],
+    rules: {
+      '@typescript-eslint/consistent-type-imports': ['error', { prefer: 'type-imports' }],
+    },
+  },
+  // https://github.com/vuejs/eslint-config-typescript
+  vueTsConfigs.recommendedTypeChecked,
+
+  {
+    languageOptions: {
+      ecmaVersion: 'latest',
+      sourceType: 'module',
+
+      globals: {
+        ...globals.browser,
+        ...globals.node, // SSR, Electron, config files
+        process: 'readonly', // process.env.*
+        ga: 'readonly', // Google Analytics
+        cordova: 'readonly',
+        Capacitor: 'readonly',
+        chrome: 'readonly', // BEX related
+        browser: 'readonly', // BEX related
+      },
+    },
+
+    // add your custom rules here
+    rules: {
+      'prefer-promise-reject-errors': 'off',
+
+      // allow debugger during development only
+      'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
+    },
+  },
+
+  {
+    files: ['src-pwa/custom-service-worker.ts'],
+    languageOptions: {
+      globals: {
+        ...globals.serviceworker,
+      },
+    },
+  },
+
+  prettierSkipFormatting,
+);

package/test-project/index.html

@@ -0,0 +1,24 @@
+<!doctype html>
+<html>
+  <head>
+    <title><%= productName %></title>
+
+    <meta charset="utf-8" />
+    <meta name="description" content="<%= productDescription %>" />
+    <meta name="format-detection" content="telephone=no" />
+    <meta name="msapplication-tap-highlight" content="no" />
+    <meta
+      name="viewport"
+      content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width<% if (ctx.mode.cordova || ctx.mode.capacitor) { %>, viewport-fit=cover<% } %>"
+    />
+
+    <link rel="icon" type="image/png" sizes="128x128" href="icons/favicon-128x128.png" />
+    <link rel="icon" type="image/png" sizes="96x96" href="icons/favicon-96x96.png" />
+    <link rel="icon" type="image/png" sizes="32x32" href="icons/favicon-32x32.png" />
+    <link rel="icon" type="image/png" sizes="16x16" href="icons/favicon-16x16.png" />
+    <link rel="icon" type="image/ico" href="favicon.ico" />
+  </head>
+  <body>
+    <!-- quasar:entry-point -->
+  </body>
+</html>

package/test-project/package.json

@@ -0,0 +1,45 @@
+{
+  "name": "test-project",
+  "version": "0.0.1",
+  "description": "A Quasar Project",
+  "productName": "Quasar App",
+  "author": "Yusuf Kandemir <yusuf.kandemir@outlook.com.tr>",
+  "type": "module",
+  "private": true,
+  "scripts": {
+    "lint": "eslint -c ./eslint.config.js \"./src*/**/*.{ts,js,cjs,mjs,vue}\"",
+    "format": "prettier --write \"**/*.{js,ts,vue,scss,html,md,json}\" --ignore-path .gitignore",
+    "test": "echo \"No test specified\" && exit 0",
+    "dev": "quasar dev",
+    "build": "quasar build",
+    "postinstall": "quasar prepare"
+  },
+  "dependencies": {
+    "@quasar/extras": "^1.16.4",
+    "quasar": "^2.16.0",
+    "vue": "^3.5.22",
+    "vue-router": "^5.0.3"
+  },
+  "devDependencies": {
+    "@eslint/js": "^10.0.1",
+    "eslint": "^10.0.3",
+    "eslint-plugin-vue": "^10.8.0",
+    "globals": "^17.4.0",
+    "vue-tsc": "^3.2.6",
+    "@vue/eslint-config-typescript": "^14.7.0",
+    "vite-plugin-checker": "^0.12.0",
+    "vue-eslint-parser": "^10.4.0",
+    "@vue/eslint-config-prettier": "^10.2.0",
+    "prettier": "^3.8.1",
+    "@types/node": "^22.19.11",
+    "@quasar/app-vite": "^2.5.1",
+    "autoprefixer": "^10.4.27",
+    "typescript": "^5.9.3"
+  },
+  "engines": {
+    "node": "^28 || ^26 || ^24 || ^22.12",
+    "npm": ">= 6.13.4",
+    "yarn": ">= 1.21.1",
+    "pnpm": ">= 10.0.0"
+  }
+}