create-vitrify 0.6.4 → 0.7.0

package/templates/quasarmd3/vitrify.config.ts

@@ -0,0 +1,204 @@
+import type { VitrifyConfig } from 'vitrify'
+import { QuasarPlugin, type QuasarPluginOptions } from 'vitrify/plugins'
+import { certificateFor } from 'devcert'
+import QuasarComponentsPlugin from '@simsustech/quasar-components/vite-plugin'
+import { QuasarPreset } from 'unocss-preset-quasar'
+import { MaterialDesign3 } from 'unocss-preset-quasar/styles'
+import { loadEnv } from 'vite'
+
+const iconifyJsonIconSet = {
+  name: 'iconify-json-mdi',
+  type: {
+    positive: 'i-mdi-check-circle',
+    negative: 'i-mdi-alert',
+    info: 'i-mdi-information',
+    warning: 'i-mdi-exclamation'
+  },
+  arrow: {
+    up: 'i-mdi-arrow-up',
+    right: 'i-mdi-arrow-right',
+    down: 'i-mdi-arrow-down',
+    left: 'i-mdi-arrow-left',
+    dropdown: 'i-mdi-menu-down'
+  },
+  chevron: {
+    left: 'i-mdi-chevron-left',
+    right: 'i-mdi-chevron-right'
+  },
+  colorPicker: {
+    spectrum: 'i-mdi-gradient-vertical',
+    tune: 'i-mdi-tune',
+    palette: 'i-mdi-palette-swatch'
+  },
+  pullToRefresh: {
+    icon: 'i-mdi-refresh'
+  },
+  carousel: {
+    left: 'i-mdi-chevron-left',
+    right: 'i-mdi-chevron-right',
+    up: 'i-mdi-chevron-up',
+    down: 'i-mdi-chevron-down',
+    navigationIcon: 'i-mdi-circle'
+  },
+  chip: {
+    remove: 'i-mdi-close-circle',
+    selected: 'i-mdi-check'
+  },
+  datetime: {
+    arrowLeft: 'i-mdi-chevron-left',
+    arrowRight: 'i-mdi-chevron-right',
+    now: 'i-mdi-clock-outline',
+    today: 'i-mdi-calendar-today'
+  },
+  editor: {
+    bold: 'i-mdi-format-bold',
+    italic: 'i-mdi-format-italic',
+    strikethrough: 'i-mdi-format-strikethrough-variant',
+    underline: 'i-mdi-format-underline',
+    unorderedList: 'i-mdi-format-list-bulleted',
+    orderedList: 'i-mdi-format-list-numbered',
+    subscript: 'i-mdi-format-subscript',
+    superscript: 'i-mdi-format-superscript',
+    hyperlink: 'i-mdi-link',
+    toggleFullscreen: 'i-mdi-fullscreen',
+    quote: 'i-mdi-format-quote-close',
+    left: 'i-mdi-format-align-left',
+    center: 'i-mdi-format-align-center',
+    right: 'i-mdi-format-align-right',
+    justify: 'i-mdi-format-align-justify',
+    print: 'i-mdi-printer',
+    outdent: 'i-mdi-format-indent-decrease',
+    indent: 'i-mdi-format-indent-increase',
+    removeFormat: 'i-mdi-format-clear',
+    formatting: 'i-mdi-format-color-text',
+    fontSize: 'i-mdi-format-size',
+    align: 'i-mdi-format-align-left',
+    hr: 'i-mdi-minus',
+    undo: 'i-mdi-undo',
+    redo: 'i-mdi-redo',
+    heading: 'i-mdi-format-size',
+    heading1: 'i-mdi-format-header-1',
+    heading2: 'i-mdi-format-header-2',
+    heading3: 'i-mdi-format-header-3',
+    heading4: 'i-mdi-format-header-4',
+    heading5: 'i-mdi-format-header-5',
+    heading6: 'i-mdi-format-header-6',
+    code: 'i-mdi-code-tags',
+    size: 'i-mdi-format-size',
+    size1: 'i-mdi-numeric-1-box',
+    size2: 'i-mdi-numeric-2-box',
+    size3: 'i-mdi-numeric-3-box',
+    size4: 'i-mdi-numeric-4-box',
+    size5: 'i-mdi-numeric-5-box',
+    size6: 'i-mdi-numeric-6-box',
+    size7: 'i-mdi-numeric-7-box',
+    font: 'i-mdi-format-font',
+    viewSource: 'i-mdi-code-tags'
+  },
+  expansionItem: {
+    icon: 'i-mdi-chevron-down',
+    denseIcon: 'i-mdi-menu-down'
+  },
+  fab: {
+    icon: 'i-mdi-plus',
+    activeIcon: 'i-mdi-close'
+  },
+  field: {
+    clear: 'i-mdi-close-circle',
+    error: 'i-mdi-alert-circle'
+  },
+  pagination: {
+    first: 'i-mdi-chevron-double-left',
+    prev: 'i-mdi-chevron-left',
+    next: 'i-mdi-chevron-right',
+    last: 'i-mdi-chevron-double-right'
+  },
+  rating: {
+    icon: 'i-mdi-star'
+  },
+  stepper: {
+    done: 'i-mdi-check',
+    active: 'i-mdi-pencil',
+    error: 'i-mdi-alert'
+  },
+  tabs: {
+    left: 'i-mdi-chevron-left',
+    right: 'i-mdi-chevron-right',
+    up: 'i-mdi-chevron-up',
+    down: 'i-mdi-chevron-down'
+  },
+  table: {
+    arrowUp: 'i-mdi-arrow-up',
+    warning: 'i-mdi-alert',
+    firstPage: 'i-mdi-chevron-double-left',
+    prevPage: 'i-mdi-chevron-left',
+    nextPage: 'i-mdi-chevron-right',
+    lastPage: 'i-mdi-chevron-double-right'
+  },
+  tree: {
+    icon: 'i-mdi-play'
+  },
+  uploader: {
+    done: 'i-mdi-check',
+    clear: 'i-mdi-close',
+    add: 'i-mdi-plus-box',
+    upload: 'i-mdi-cloud-upload',
+    removeQueue: 'i-mdi-notification-clear-all',
+    removeUploaded: 'i-mdi-check-all'
+  }
+}
+
+const quasarConf: QuasarPluginOptions = {
+  framework: {
+    plugins: ['Dialog', 'Notify', 'Loading', 'Meta'],
+    iconSet: iconifyJsonIconSet
+  },
+  /*
+   * Disable SASS if you use UnoCSS
+   */
+  disableSass: true
+}
+
+export default async function ({ mode, command }): Promise<VitrifyConfig> {
+  const env = loadEnv(mode, process.cwd(), '')
+  const config: VitrifyConfig = {
+    plugins: [QuasarComponentsPlugin()],
+    vitrify: {
+      plugins: [
+        {
+          plugin: QuasarPlugin,
+          options: quasarConf
+        }
+      ],
+      lang: env.VITE_LANG,
+      productName: 'Quasar MD3',
+      hooks: {
+        onSetup: []
+      },
+      ssr: {
+        serverModules: []
+      },
+      unocss: {
+        presets: [
+          QuasarPreset({
+            style: MaterialDesign3,
+            sourceColor: env.VITE_SOURCE_COLOR,
+            plugins: quasarConf['framework']['plugins'],
+            iconSet: quasarConf['framework']['iconSet']
+          })
+        ],
+        content: {
+          pipeline: {
+            include: [/@simsustech\/quasar-components/]
+          }
+        }
+      }
+    }
+  }
+  if (mode === 'development') {
+    config.server = {
+      https: await certificateFor('vitrify.local')
+    }
+  }
+  return config
+}

package/templates/vue/.vscode/extensions.json

@@ -0,0 +1,3 @@
+{
+  "recommendations": ["vue.volar", "dbaeumer.vscode-eslint"]
+}

package/templates/vue/_gitignore

@@ -0,0 +1,3 @@
+node_modules
+dist
+*.local

package/templates/vue/_prettierignore

@@ -0,0 +1,3 @@
+dist/
+node_modules/
+pnpm-lock.yaml

package/templates/vue/_prettierrc.json

@@ -0,0 +1,22 @@
+{
+  "semi": false,
+  "tabWidth": 2,
+  "singleQuote": true,
+  "printWidth": 80,
+  "trailingComma": "none",
+  "overrides": [
+    {
+      "files": ["*.json5"],
+      "options": {
+        "singleQuote": false,
+        "quoteProps": "preserve"
+      }
+    },
+    {
+      "files": ["*.yml"],
+      "options": {
+        "singleQuote": false
+      }
+    }
+  ]
+}

package/templates/vue/eslint.config.js

@@ -0,0 +1,27 @@
+import eslintPluginPrettierRecommended from 'eslint-plugin-prettier/recommended'
+import pluginVue from 'eslint-plugin-vue'
+import typescriptEslint from 'typescript-eslint'
+import vueParser from 'vue-eslint-parser'
+
+export default typescriptEslint.config(
+  ...typescriptEslint.configs.recommended,
+  ...pluginVue.configs['flat/recommended'],
+
+  {
+    files: ['**/*.vue'],
+    languageOptions: {
+      parser: vueParser,
+      parserOptions: {
+        sourceType: 'module',
+        parser: {
+          ts: typescriptEslint.parser
+        }
+      }
+    }
+  },
+
+  /**
+   * end
+   */
+  eslintPluginPrettierRecommended
+)

package/templates/vue/index.html

@@ -0,0 +1,14 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link rel="icon" href="/favicon.ico" />
+    <title></title>
+  </head>
+
+  <body>
+    <!-- A body opening and closing tag is sufficient for Vitrify -->
+    <div id="app"></div>
+  </body>
+</html>

package/templates/vue/src/App.test.js

@@ -0,0 +1,3 @@
+test('App', async () => {
+  expect(true).toBeTruthy()
+})

package/templates/vue/src/App.vue

@@ -0,0 +1,20 @@
+<template>
+  <router-view v-slot="{ Component }">
+    <Suspense>
+      <template #default>
+        <component :is="Component" />
+      </template>
+      <template #fallback>
+        <div>Loading...</div>
+      </template>
+    </Suspense>
+  </router-view>
+</template>
+
+<script lang="ts">
+export default {
+  name: 'App'
+}
+</script>
+
+<script setup lang="ts"></script>

package/templates/vue/src/components/HelloWorld.vue

@@ -0,0 +1,9 @@
+<template>Hello world!</template>
+
+<script lang="ts">
+export default {
+  name: 'HelloWorldComponent'
+}
+</script>
+
+<script lang="ts" setup></script>

package/templates/vue/src/layouts/MainLayout.vue

@@ -0,0 +1,5 @@
+<template>
+  <router-view />
+</template>
+
+<script setup lang="ts"></script>

package/templates/vue/src/pages/Error404Page.vue

@@ -0,0 +1,9 @@
+<template>404</template>
+
+<scirpt lang="ts">
+export default {
+  name: 'Error404Page'
+}
+</scirpt>
+
+<script setup lang="ts"></script>

package/templates/vue/src/pages/IndexPage.vue

@@ -0,0 +1,13 @@
+<template>
+  <hello-world> </hello-world>
+</template>
+
+<scirpt lang="ts">
+export default {
+  name: 'IndexPage'
+}
+</scirpt>
+
+<script setup lang="ts">
+import HelloWorld from '../components/HelloWorld.vue'
+</script>

package/templates/vue/src/router/index.ts

@@ -0,0 +1,17 @@
+import {
+  createMemoryHistory,
+  createRouter as _createRouter,
+  createWebHistory
+} from 'vue-router'
+import routes from './routes'
+
+export default function createRouter() {
+  return _createRouter({
+    // use appropriate history implementation for server/client
+    // import.meta.env.SSR is injected by Vite.
+    history: import.meta.env.SSR
+      ? createMemoryHistory(__BASE_URL__)
+      : createWebHistory(__BASE_URL__),
+    routes
+  })
+}

package/templates/vue/src/router/routes.ts

@@ -0,0 +1,19 @@
+import { RouteRecordRaw } from 'vue-router'
+
+const routes: RouteRecordRaw[] = [
+  {
+    path: '/',
+    component: () => import('../layouts/MainLayout.vue'),
+    children: [{ path: '', component: () => import('../pages/IndexPage.vue') }]
+  },
+
+  // Always leave this as last one,
+  // but you can also remove it
+  {
+    path: '/404',
+    alias: '/:catchAll(.*)*',
+    component: () => import('../pages/Error404Page.vue')
+  }
+]
+
+export default routes

package/templates/vue/src/setup.ts

@@ -0,0 +1,9 @@
+import type { FastifyInstance } from 'fastify'
+
+/**
+ * Only used in SSR/SSG
+ */
+export default async function (fastify: FastifyInstance) {
+  fastify.log('Running setup function...')
+  console.log('Running setup function...')
+}

package/templates/vue/src/shims-vue.d.ts

@@ -0,0 +1,6 @@
+// Mocks all files ending in `.vue` showing them as plain Vue instances
+declare module '*.vue' {
+  import type { ComponentOptions } from 'vue'
+  const component: ComponentOptions
+  export default component
+}

package/templates/vue/vitrify.config.ts

@@ -0,0 +1,21 @@
+import type { VitrifyConfig } from 'vitrify'
+import { certificateFor } from 'devcert'
+
+export default async function ({ mode, command }): Promise<VitrifyConfig> {
+  const config: VitrifyConfig = {
+    vitrify: {
+      hooks: {
+        onSetup: [new URL('src/setup.ts', import.meta.url)]
+      },
+      ssr: {
+        serverModules: []
+      }
+    }
+  }
+  if (mode === 'development') {
+    config.server = {
+      https: await certificateFor('vitrify.test')
+    }
+  }
+  return config
+}

package/templates/quasar/_eslintrc.cjs

@@ -1,19 +0,0 @@
-module.exports = {
-  ignorePatterns: ['.eslintrc.cjs'],
-  extends: [
-    'eslint:recommended',
-    'plugin:@typescript-eslint/recommended',
-    'plugin:vue/vue3-recommended',
-    'plugin:prettier-vue/recommended'
-  ],
-  parser: 'vue-eslint-parser',
-  parserOptions: {
-    parser: '@typescript-eslint/parser',
-    sourceType: 'module'
-  },
-  rules: {
-    '@typescript-eslint/ban-ts-comment': 0
-  },
-  plugins: ['@typescript-eslint'],
-  root: true
-}