npm - create-quasar - Versions diffs - 1.12.0 → 2.0.0 - Mend

create-quasar 1.12.0 → 2.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (296) hide show

package/templates/app/quasar-v2/js-webpack-4/BASE/_package.json ADDED Viewed

@@ -0,0 +1,58 @@
+{
+  "name": "<%= name %>",
+  "version": "0.0.1",
+  "description": "<%= description %>",
+  "productName": "<%= productName %>",
+  "author": "<%= author %>",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    <% if (preset.eslint) { %>"lint": "eslint -c ./eslint.config.js \"./src*/**/*.{js,cjs,mjs,vue}\"",<% } %>
+    <% if (prettier) { %>"format": "prettier --write \"**/*.{js,vue<% if (css !== 'sass') { %>,<%= css %><% } %>,html,md,json}\" --ignore-path .gitignore",<% } %>
+    "test": "echo \"No test specified\" && exit 0",
+    "dev": "quasar dev",
+    "build": "quasar build",
+    "postinstall": "quasar prepare"
+  },
+  "dependencies": {
+    <% if (preset.axios) { %>"axios": "^1.2.1",<% } %>
+    <% if (preset.i18n) { %>"vue-i18n": "^9.0.0",<% } %>
+    <% if (preset.pinia) { %>"pinia": "^3.0.1",<% } %>
+    "@quasar/extras": "^1.16.4",
+    "core-js": "^3.31.1",
+    "quasar": "^2.16.0",
+    "vue": "^3.4.18",
+    "vue-router": "^4.0.12"
+  },
+  "devDependencies": {
+    <% if (preset.eslint) { %>
+    "@eslint/js": "^9.14.0",
+    "eslint": "^9.14.0",
+    "eslint-plugin-vue": "^9.30.0",
+    "eslint-webpack-plugin": "^4.2.0",
+    "globals": "^15.12.0",
+    <% } %>
+    <% if (prettier) { %>
+    "@vue/eslint-config-prettier": "^10.1.0",
+    "prettier": "^3.3.3",
+    <% } %>
+    "@quasar/app-webpack": "^4.1.0",
+    "autoprefixer": "^10.4.2"
+  },
+  "browserslist": [
+    "last 10 Chrome versions",
+    "last 10 Firefox versions",
+    "last 4 Edge versions",
+    "last 7 Safari versions",
+    "last 8 Android versions",
+    "last 8 ChromeAndroid versions",
+    "last 8 FirefoxAndroid versions",
+    "last 10 iOS versions",
+    "last 5 Opera versions"
+  ],
+  "engines": {
+    "node": "^28 || ^26 || ^24 || ^22 || ^20 || ^18",
+    "npm": ">= 6.13.4",
+    "yarn": ">= 1.21.1"
+  }
+}

package/templates/app/quasar-v2/js-webpack-4/BASE/babel.config.js ADDED Viewed

@@ -0,0 +1,12 @@
+export default api => {
+  return {
+    presets: [
+      [
+        '@quasar/babel-preset-app',
+        api.caller(caller => caller && caller.target === 'node')
+          ? { targets: { node: 'current' } }
+          : {}
+      ]
+    ]
+  }
+}

package/templates/app/{quasar-v1/js/BASE/src/index.template.html → quasar-v2/js-webpack-4/BASE/index.html} RENAMED Viewed

@@ -7,7 +7,7 @@
     <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 \<% } %\>' %>">
+    <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">
@@ -16,7 +16,6 @@
     <link rel="icon" type="image/ico" href="favicon.ico">
   </head>
   <body>
-    <!-- DO NOT touch the following DIV -->
-    <div id="q-app"></div>
+    <!-- quasar:entry-point -->
   </body>
 </html>

package/templates/{ui-kit/quasar-v1/BASE/ui/dev/_.postcssrc.js → app/quasar-v2/js-webpack-4/BASE/postcss.config.js} RENAMED Viewed

@@ -1,8 +1,9 @@
 // https://github.com/michael-ciniawsky/postcss-load-config
+import autoprefixer from 'autoprefixer'
-module.exports = {
+export default {
   plugins: [
     // to edit target browsers: use "browserslist" field in package.json
-    require('autoprefixer')
+    autoprefixer
   ]
 }

package/templates/app/quasar-v2/js-webpack-4/BASE/quasar.config.js ADDED Viewed

@@ -0,0 +1,221 @@
+// Configuration for your app
+// https://v2.quasar.dev/quasar-cli-webpack/quasar-config-file
+import { defineConfig } from '#q-app/wrappers'
+export default defineConfig((ctx) => {
+  return {<% if (preset.eslint) { %>
+    eslint: {
+      // fix: true,
+      // include: [],
+      // exclude: [],
+      // cache: false,
+      // rawEsbuildEslintOptions: {},
+      // rawWebpackEslintPluginOptions: {},
+      warnings: true,
+      errors: true
+    },
+<% } %>
+    // https://v2.quasar.dev/quasar-cli-webpack/prefetch-feature
+    // preFetch: true,
+    // app boot file (/src/boot)
+    // --> boot files are part of "main.js"
+    // https://v2.quasar.dev/quasar-cli-webpack/boot-files
+    boot: [<% if (preset.i18n) { %>
+      'i18n'<% } %><% if (preset.axios) { %><%= preset.i18n ? ',' : '' %>
+      'axios'<% } %>
+    ],
+    // https://v2.quasar.dev/quasar-cli-webpack/quasar-config-file#css
+    css: [
+      'app.<%= css %>'
+    ],
+    // https://github.com/quasarframework/quasar/tree/dev/extras
+    extras: [
+      // 'ionicons-v4',
+      // 'mdi-v7',
+      // 'fontawesome-v6',
+      // 'eva-icons',
+      // 'themify',
+      // 'line-awesome',
+      // 'roboto-font-latin-ext', // this or either 'roboto-font', NEVER both!
+      'roboto-font', // optional, you are not bound to it
+      'material-icons', // optional, you are not bound to it
+    ],
+    // Full list of options: https://v2.quasar.dev/quasar-cli-webpack/quasar-config-file#build
+    build: {
+      // publicPath: '/',
+      vueRouterMode: 'hash', // available values: 'hash', 'history'
+      // webpackTranspile: false,
+      // Add dependencies for transpiling with Babel (Array of string/regex)
+      // (from node_modules, which are by default not transpiled).
+      // Applies only if "webpackTranspile" is set to true.
+      // webpackTranspileDependencies: [],
+      esbuildTarget: {
+        browser: [ 'es2022', 'firefox115', 'chrome115', 'safari14' ],
+        node: 'node20'
+      },
+      // rtl: true, // https://quasar.dev/options/rtl-support
+      // showProgress: false,
+      // gzip: true,
+      // analyze: true,
+      // Options below are automatically set depending on the env, set them if you want to override
+      // extractCSS: false,
+      // https://v2.quasar.dev/quasar-cli-webpack/handling-webpack
+      // "chain" is a webpack-chain object https://github.com/sorrycc/webpack-chain
+      // chainWebpack (/* chain, { isClient, isServer } */) {}
+    },
+    // Full list of options: https://v2.quasar.dev/quasar-cli-webpack/quasar-config-file#devserver
+    devServer: {
+      server: {
+        type: 'http'
+      },
+      open: true // opens browser window automatically
+    },
+    // https://v2.quasar.dev/quasar-cli-webpack/quasar-config-file#framework
+    framework: {
+      config: {},
+      // iconSet: 'material-icons', // Quasar icon set
+      // lang: 'en-US', // Quasar language pack
+      // For special cases outside of where the auto-import strategy can have an impact
+      // (like functional components as one of the examples),
+      // you can manually specify Quasar components/directives to be available everywhere:
+      //
+      // components: [],
+      // directives: [],
+      // Quasar plugins
+      plugins: []
+    },
+    // animations: 'all', // --- includes all animations
+    // https://quasar.dev/options/animations
+    animations: [],
+    // https://v2.quasar.dev/quasar-cli-webpack/quasar-config-file#sourcefiles
+    // sourceFiles: {
+    //   rootComponent: 'src/App.vue',
+    //   router: 'src/router/index',
+    //   store: 'src/store/index',
+    //   indexHtmlTemplate: 'index.html',
+    //   pwaRegisterServiceWorker: 'src-pwa/register-service-worker',
+    //   pwaServiceWorker: 'src-pwa/custom-service-worker',
+    //   pwaManifestFile: 'src-pwa/manifest.json',
+    //   electronMain: 'src-electron/electron-main',
+    //   electronPreload: 'src-electron/electron-preload'
+    //   bexManifestFile: 'src-bex/manifest.json
+    // },
+    // https://v2.quasar.dev/quasar-cli-webpack/developing-ssr/configuring-ssr
+    ssr: {
+      prodPort: 3000, // The default port that the production server should use
+                      // (gets superseded if process.env.PORT is specified at runtime)
+      middlewares: [
+        'render' // keep this as last one
+      ],
+      // extendPackageJson (json) {},
+      // extendSSRWebserverConf (esbuildConf) {},
+      // manualStoreSerialization: true,
+      // manualStoreSsrContextInjection: true,
+      // manualStoreHydration: true,
+      // manualPostHydrationTrigger: true,
+      pwa: false
+      // pwaOfflineHtmlFilename: 'offline.html', // do NOT use index.html as name!
+      // pwaExtendGenerateSWOptions (cfg) {},
+      // pwaExtendInjectManifestOptions (cfg) {}
+    },
+    // https://v2.quasar.dev/quasar-cli-webpack/developing-pwa/configuring-pwa
+    pwa: {
+      workboxMode: 'GenerateSW' // 'GenerateSW' or 'InjectManifest'
+      // swFilename: 'sw.js',
+      // manifestFilename: 'manifest.json',
+      // extendManifestJson (json) {},
+      // useCredentialsForManifestTag: true,
+      // injectPwaMetaTags: false,
+      // extendPWACustomSWConf (esbuildConf) {},
+      // extendGenerateSWOptions (cfg) {},
+      // extendInjectManifestOptions (cfg) {}
+    },
+    // Full list of options: https://v2.quasar.dev/quasar-cli-webpack/developing-cordova-apps/configuring-cordova
+    cordova: {
+      // noIosLegacyBuildFlag: true, // uncomment only if you know what you are doing
+    },
+    // Full list of options: https://v2.quasar.dev/quasar-cli-webpack/developing-capacitor-apps/configuring-capacitor
+    capacitor: {
+      hideSplashscreen: true
+    },
+    // Full list of options: https://v2.quasar.dev/quasar-cli-webpack/developing-electron-apps/configuring-electron
+    electron: {
+      // extendElectronMainConf (esbuildConf) {},
+      // extendElectronPreloadConf (esbuildConf) {},
+      // extendPackageJson (json) {},
+      // Electron preload scripts (if any) from /src-electron, WITHOUT file extension
+      preloadScripts: [ 'electron-preload' ],
+      // specify the debugging port to use for the Electron app when running in development mode
+      inspectPort: 5858,
+      bundler: 'packager', // 'packager' or 'builder'
+      packager: {
+        // https://github.com/electron-userland/electron-packager/blob/master/docs/api.md#options
+        // OS X / Mac App Store
+        // appBundleId: '',
+        // appCategoryType: '',
+        // osxSign: '',
+        // protocol: 'myapp://path',
+        // Windows only
+        // win32metadata: { ... }
+      },
+      builder: {
+        // https://www.electron.build/configuration/configuration
+        appId: '<%= name %>'
+      }
+    },
+    // Full list of options: https://v2.quasar.dev/quasar-cli-webpack/developing-browser-extensions/configuring-bex
+    bex: {
+      // extendBexScriptsConf (esbuildConf) {},
+      // extendBexManifestJson (json) {},
+      /**
+       * The list of extra scripts (js/ts) not in your bex manifest that you want to
+       * compile and use in your browser extension. Maybe dynamic use them?
+       *
+       * Each entry in the list should be a relative filename to /src-bex/
+       *
+       * @example [ 'my-script.ts', 'sub-folder/my-other-script.js' ]
+       */
+      extraScripts: []
+    }
+  }
+})

package/templates/app/quasar-v2/js-webpack-4/BASE/src/App.vue ADDED Viewed

@@ -0,0 +1,14 @@
+<template>
+  <router-view />
+</template>
+<% if (sfcStyle === 'composition-setup') { %>
+<script setup>
+//
+</script><% } else if (sfcStyle === 'composition' || sfcStyle === 'options') { %>
+<script>
+import { defineComponent } from 'vue';
+export default defineComponent({
+  name: 'App'
+});
+</script><% } %>

package/templates/app/quasar-v2/js-webpack-4/BASE/src/components/EssentialLink.vue ADDED Viewed

@@ -0,0 +1,72 @@
+<template>
+  <q-item
+    clickable
+    tag="a"
+    target="_blank"
+    :href="<% if (sfcStyle === 'composition-setup') { %>props.<% } %>link"
+  >
+    <q-item-section
+      v-if="<% if (sfcStyle === 'composition-setup') { %>props.<% } %>icon"
+      avatar
+    >
+      <q-icon :name="<% if (sfcStyle === 'composition-setup') { %>props.<% } %>icon" />
+    </q-item-section>
+    <q-item-section>
+      <q-item-label>{{ <% if (sfcStyle === 'composition-setup') { %>props.<% } %>title }}</q-item-label>
+      <q-item-label caption>{{ <% if (sfcStyle === 'composition-setup') { %>props.<% } %>caption }}</q-item-label>
+    </q-item-section>
+  </q-item>
+</template>
+<% if (sfcStyle === 'composition-setup') { %>
+<script setup>
+const props = defineProps({
+  title: {
+    type: String,
+    required: true
+  },
+  caption: {
+    type: String,
+    default: ''
+  },
+  link: {
+    type: String,
+    default: '#'
+  },
+  icon: {
+    type: String,
+    default: ''
+  }
+})
+</script><% } else if (sfcStyle === 'composition' || sfcStyle === 'options') { %>
+<script>
+import { defineComponent } from 'vue'
+export default defineComponent({
+  name: 'EssentialLink',
+  props: {
+    title: {
+      type: String,
+      required: true
+    },
+    caption: {
+      type: String,
+      default: ''
+    },
+    link: {
+      type: String,
+      default: '#'
+    },
+    icon: {
+      type: String,
+      default: ''
+    }
+  }
+})
+</script><% } %>

package/templates/app/quasar-v2/js-webpack-4/BASE/src/layouts/MainLayout.vue ADDED Viewed

@@ -0,0 +1,241 @@
+<template>
+  <q-layout view="lHh Lpr lFf">
+    <q-header elevated>
+      <q-toolbar>
+        <q-btn
+          flat
+          dense
+          round
+          icon="menu"
+          aria-label="Menu"
+          @click="toggleLeftDrawer"
+        />
+        <q-toolbar-title>
+          Quasar App
+        </q-toolbar-title>
+        <div>Quasar v{{ $q.version }}</div>
+      </q-toolbar>
+    </q-header>
+    <q-drawer
+      v-model="leftDrawerOpen"
+      show-if-above
+      bordered
+    >
+      <q-list>
+        <q-item-label
+          header
+        >
+          Essential Links
+        </q-item-label>
+        <EssentialLink
+          v-for="link in linksList"
+          :key="link.title"
+          v-bind="link"
+        />
+      </q-list>
+    </q-drawer>
+    <q-page-container>
+      <router-view />
+    </q-page-container>
+  </q-layout>
+</template>
+<% if (sfcStyle === 'composition-setup') { %>
+<script setup>
+import { ref } from 'vue'
+import EssentialLink from 'components/EssentialLink.vue'
+const linksList = [
+  {
+    title: 'Docs',
+    caption: 'quasar.dev',
+    icon: 'school',
+    link: 'https://quasar.dev'
+  },
+  {
+    title: 'Github',
+    caption: 'github.com/quasarframework',
+    icon: 'code',
+    link: 'https://github.com/quasarframework'
+  },
+  {
+    title: 'Discord Chat Channel',
+    caption: 'chat.quasar.dev',
+    icon: 'chat',
+    link: 'https://chat.quasar.dev'
+  },
+  {
+    title: 'Forum',
+    caption: 'forum.quasar.dev',
+    icon: 'record_voice_over',
+    link: 'https://forum.quasar.dev'
+  },
+  {
+    title: 'Twitter',
+    caption: '@quasarframework',
+    icon: 'rss_feed',
+    link: 'https://twitter.quasar.dev'
+  },
+  {
+    title: 'Facebook',
+    caption: '@QuasarFramework',
+    icon: 'public',
+    link: 'https://facebook.quasar.dev'
+  },
+  {
+    title: 'Quasar Awesome',
+    caption: 'Community Quasar projects',
+    icon: 'favorite',
+    link: 'https://awesome.quasar.dev'
+  }
+]
+const leftDrawerOpen = ref(false)
+function toggleLeftDrawer () {
+  leftDrawerOpen.value = !leftDrawerOpen.value
+}
+</script><% } else if (sfcStyle === 'composition') { %>
+<script>
+import { defineComponent, ref } from 'vue'
+import EssentialLink from 'components/EssentialLink.vue'
+const linksList = [
+  {
+    title: 'Docs',
+    caption: 'quasar.dev',
+    icon: 'school',
+    link: 'https://quasar.dev'
+  },
+  {
+    title: 'Github',
+    caption: 'github.com/quasarframework',
+    icon: 'code',
+    link: 'https://github.com/quasarframework'
+  },
+  {
+    title: 'Discord Chat Channel',
+    caption: 'chat.quasar.dev',
+    icon: 'chat',
+    link: 'https://chat.quasar.dev'
+  },
+  {
+    title: 'Forum',
+    caption: 'forum.quasar.dev',
+    icon: 'record_voice_over',
+    link: 'https://forum.quasar.dev'
+  },
+  {
+    title: 'Twitter',
+    caption: '@quasarframework',
+    icon: 'rss_feed',
+    link: 'https://twitter.quasar.dev'
+  },
+  {
+    title: 'Facebook',
+    caption: '@QuasarFramework',
+    icon: 'public',
+    link: 'https://facebook.quasar.dev'
+  },
+  {
+    title: 'Quasar Awesome',
+    caption: 'Community Quasar projects',
+    icon: 'favorite',
+    link: 'https://awesome.quasar.dev'
+  }
+]
+export default defineComponent({
+  name: 'MainLayout',
+  components: {
+    EssentialLink
+  },
+  setup () {
+    const leftDrawerOpen = ref(false)
+    return {
+      linksList,
+      leftDrawerOpen,
+      toggleLeftDrawer () {
+        leftDrawerOpen.value = !leftDrawerOpen.value
+      }
+    }
+  }
+})
+</script><% } else if (sfcStyle === 'options') { %>
+<script>
+import { defineComponent, ref } from 'vue'
+import EssentialLink from 'components/EssentialLink.vue'
+const linksList = [
+  {
+    title: 'Docs',
+    caption: 'quasar.dev',
+    icon: 'school',
+    link: 'https://quasar.dev'
+  },
+  {
+    title: 'Github',
+    caption: 'github.com/quasarframework',
+    icon: 'code',
+    link: 'https://github.com/quasarframework'
+  },
+  {
+    title: 'Discord Chat Channel',
+    caption: 'chat.quasar.dev',
+    icon: 'chat',
+    link: 'https://chat.quasar.dev'
+  },
+  {
+    title: 'Forum',
+    caption: 'forum.quasar.dev',
+    icon: 'record_voice_over',
+    link: 'https://forum.quasar.dev'
+  },
+  {
+    title: 'Twitter',
+    caption: '@quasarframework',
+    icon: 'rss_feed',
+    link: 'https://twitter.quasar.dev'
+  },
+  {
+    title: 'Facebook',
+    caption: '@QuasarFramework',
+    icon: 'public',
+    link: 'https://facebook.quasar.dev'
+  },
+  {
+    title: 'Quasar Awesome',
+    caption: 'Community Quasar projects',
+    icon: 'favorite',
+    link: 'https://awesome.quasar.dev'
+  }
+]
+export default defineComponent({
+  name: 'MainLayout',
+  components: {
+    EssentialLink
+  },
+  data () {
+    return {
+      linksList,
+      leftDrawerOpen: false
+    }
+  },
+  methods: {
+    toggleLeftDrawer () {
+      this.leftDrawerOpen = !this.leftDrawerOpen
+    }
+  }
+})
+</script><% } %>

package/templates/app/quasar-v2/js-webpack-4/BASE/src/pages/ErrorNotFound.vue ADDED Viewed

@@ -0,0 +1,34 @@
+<template>
+  <div class="fullscreen bg-blue text-white text-center q-pa-md flex flex-center">
+    <div>
+      <div style="font-size: 30vh">
+        404
+      </div>
+      <div class="text-h2" style="opacity:.4">
+        Oops. Nothing here...
+      </div>
+      <q-btn
+        class="q-mt-xl"
+        color="white"
+        text-color="blue"
+        unelevated
+        to="/"
+        label="Go Home"
+        no-caps
+      />
+    </div>
+  </div>
+</template>
+<% if (sfcStyle === 'composition-setup') { %>
+<script setup>
+//
+</script><% } else if (sfcStyle === 'composition' || sfcStyle === 'options') { %>
+<script>
+import { defineComponent } from 'vue';
+export default defineComponent({
+  name: 'ErrorNotFound'
+});
+</script><% } %>