Added PrimeVue Tailwind Setup

Author: TechAkayy

.eslintrc.cjs

@@ -0,0 +1,35 @@
+/* eslint-env node */
+require('@rushstack/eslint-patch/modern-module-resolution')
+
+module.exports = {
+  root: true,
+  env: {
+    node: true,
+  },
+  extends: [
+    'plugin:vue/vue3-essential',
+    'eslint:recommended',
+    '@vue/eslint-config-typescript',
+    '@vue/eslint-config-prettier/skip-formatting',
+  ],
+  overrides: [
+    {
+      // These pages are not used directly by users so they can have one-word names.
+      files: [
+        '**/pages/**/*.{js,ts,vue}',
+        '**/layouts/**/*.{js,ts,vue}',
+        '**/app.{js,ts,vue}',
+        '**/error.{js,ts,vue}',
+      ],
+      rules: { 'vue/multi-word-component-names': 'off' },
+    },
+  ],
+  rules: {
+    // override/add rules settings here, such as:
+    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
+    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
+  },
+  parserOptions: {
+    ecmaVersion: 'latest',
+  },
+}

.gitignore

@@ -0,0 +1,46 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+.DS_Store
+.unlighthouse
+dist
+dist-ssr
+coverage
+*.local
+
+/cypress/videos/
+/cypress/screenshots/
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+!.vscode/settings.json
+.idea
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+
+# Pinegrow
+_pgbackup
+_pginfo
+
+## optional
+pinegrow.json
+
+## optional
+## Uncomment the below as per your needs
+## add any d.ts files that are auto-generated, for eg,
+auto-imports.d.ts
+components.d.ts
+composables.d.ts
+## rollup visualizer
+stats.html

.npmrc

@@ -0,0 +1,3 @@
+shamefully-hoist=true
+auto-install-peers=true
+legacy-peer-deps=true

.prettierrc.cjs

@@ -0,0 +1,9 @@
+module.exports = {
+  vueIndentScriptAndStyle: true,
+  semi: false,
+  singleQuote: true,
+  bracketSpacing: true,
+  tabWidth: 2,
+  useTabs: false,
+  trailingComma: 'all',
+}

.vscode/extensions.json

@@ -0,0 +1,8 @@
+{
+  "recommendations": [
+    "Vue.volar",
+    "dbaeumer.vscode-eslint",
+    "esbenp.prettier-vscode",
+    "bradlc.vscode-tailwindcss"
+  ]
+}

.vscode/settings.json

@@ -0,0 +1,14 @@
+{
+  "editor.formatOnSave": true,
+  "editor.codeActionsOnSave": {
+    "source.fixAll": "never",
+    "source.fixAll.eslint": "explicit"
+  },
+  "eslint.validate": ["javascript", "javascriptreact", "vue"],
+  "typescript.tsdk": "node_modules/typescript/lib",
+  "search.exclude": {
+    "**/_pgbackup": true,
+    "dist": true,
+    ".unlighthouse": true
+  }
+}

README.md

@@ -0,0 +1,155 @@
+# Vue Designer PrimeVue Tailwind CSS - Quick start template
+
+This is a starter template that pre-includes the [Pinegrow Vite Plugin](https://www.npmjs.com/package/@pinegrow/vite-plugin), [Pinegrow Tailwind CSS Plugin](https://www.npmjs.com/package/@pinegrow/tailwindcss-plugin) and other goodies for Vue Designer.
+
+Demo - https://pg-vue-primevue-tailwindcss.netlify.app/
+
+## Vue Designer
+
+A desktop visual editor for Vue apps supporting Mac, Windows, and Linux by [Pinegrow](https://pinegrow.com/). Take it for a free trial at [Vue Designer](https://vuedesigner.com)!
+
+It lets you visually design 🎨 your Vue single file components and boosts your productivity and creativity while building your component-based Vue apps.
+
+It smartly integrates with your ⚡️ [Vite](https://vitejs.dev/) based CLI and provides an amazing developer experience with its powerful visual controls and features.
+
+Clean code 😃, No lock-in - You are in control of your projects and development workflow ❤️
+
+## Try it now!
+
+### 1. Clone to local
+
+[Create a repo from this template on GitHub](https://github.com/pinegrow/pg-vue-primevue-tailwindcss/generate).
+
+(or)
+
+If you prefer to do it manually with the cleaner git history
+
+```bash
+npx giget@latest gh:pinegrow/pg-vue-primevue-tailwindcss my-vue-primevue-tailwindcss-app #project-name
+cd my-vue-primevue-tailwindcss-app
+npm install #or use pnpm
+```
+
+(or)
+
+If you prefer a minimal template (a single empty home page) instead,
+
+```bash
+npx giget@latest gh:pinegrow/pg-vue-primevue-tailwindcss#minimal my-vue-primevue-tailwindcss-app #project-name
+cd my-vue-primevue-tailwindcss-app
+npm install #or use pnpm
+```
+
+## 2. Open in Vue Designer
+
+Open your project in Vue Designer and follow the instructions displayed in the Config Panel (that should pop out automatically). Config Panel ⚙️ displays the key packages and the various links to their individual ecosystems and communities.
+
+## Usage
+
+### Start your development server
+
+```bash
+npm run dev
+```
+
+### Build
+
+```bash
+npm run build
+```
+
+### Analyze
+
+Uncomment the `rollup-plugin-visualizer` usage in your config file and execute the `build` command. This command will generate `stats.html`. Open `stats.html` in your browser to analyze bundle sizes.
+
+```bash
+npm run build # open stats.html to analyze bundle sizes
+```
+
+### Preview
+
+```bash
+npm run now # build & preview
+```
+
+### Lighthouse
+
+```bash
+npm run unlighthouse # Uses npx unlighthouse from https://unlighthouse.dev/ to run lighthouse on entire site (all pages)
+```
+
+### Deploy to Netlify
+
+You can deploy this repo as a site on your own to explore and experiment with, by clicking this button.
+[![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/Pinegrow/pg-vue-primevue-tailwindcss)
+
+Check out the [deployment documentation](https://vitejs.dev/guide/static-deploy.html#netlify) for more information.
+
+## Pre-packed
+
+### Meta Framework (Vue-based)
+
+- [Vite](https://vitejs.dev/) - Vite-powered Vue SPA
+  - 👉 Follow the amazing Vue [docs](https://vuejs.org/guide/introduction.html)
+  - 🚦 [Vue-Router](https://vuejs.org/guide/introduction.html) for client-side routing. Expressive, configurable, convenient enables snappy navigation.
+
+### UI Frameworks
+
+- [Tailwind CSS](https://tailwindcss.com/docs/guides/vite#vue) - The amazing utility-first CSS framework.
+
+### File-based CMS (markdown)
+
+- [unplugin-vue-markdown](https://github.com/mdit-vue/unplugin-vue-markdown) - file-based CMS powered by Markdown & Vue components. Note: This page is a markdown file 🗒.
+
+### Icons
+
+- [UnoCSS Preset Icons](https://github.com/unocss/unocss/tree/main/packages/preset-icons/) - use over 100,000 open-source [Iconify](https://iconify.design/) icons. Uses the **unocss** format for icon names, for example, `i-mdi-home`.
+
+### Modules/Plugins
+
+- [Pinegrow Vite Plugin](https://www.npmjs.com/package/@pinegrow/vite-plugin) - enables you to live-design your Vue single-file components visually in Vue Designer.
+- [Pinegrow Tailwind CSS Plugin](https://www.npmjs.com/package/@pinegrow/tailwindcss-plugin) - via Design Panel, enables visual controls customization (automatic) and theme customization (optional).
+- [unplugin-vue-router](https://github.com/posva/unplugin-vue-router) - Next-gen file based routing with type support for Vue Router.
+- [vite-plugin-vue-layouts](https://github.com/JohnCampionJr/vite-plugin-vue-layouts) - Router based layout for Vue applications using Vite.
+- 📲 [unplugin-vue-components](https://github.com/antfu/unplugin-vue-components) - On-demand components auto importing for Vue.
+- 📲 [unplugin-auto-import](https://github.com/antfu/unplugin-auto-import) - Auto import APIs on-demand for Vite, Webpack and Rollup.
+- [VueUse](https://vueuse.org/) - collection of essential Vue composition utilities.
+- 🍍 [Pinia](https://pinia.vuejs.org/) stores for global state management. Its light-weight, type-safe, extensible, modular with vue-devtools support.
+- [VeeValidate](https://vee-validate.logaretm.com/v4/) takes care of value tracking, validation, errors, submissions and more.
+
+### Devtools
+
+- [Vite Devtools](https://devtools-next.vuejs.org/guide/vite-plugin) - A Vite plugin for Vue that enhances your DX (developer experience) with an amazing set of in-app features. This is an in-app alternative to browser-based/standalone Vue Devtools.
+- [Vue Devtools](https://devtools.vuejs.org/guide/installation.html#standalone) - Official devtools that can be used as a standalone app alongside Vue Designer. It's conditionally configured in `main.ts` (only during development).
+  - **ACTION REQUIRED**: Currently deactivated. In `main.ts`, uncomment the top devtools related snippet to activate.
+
+### VS Code Extensions
+
+- [VS Code Extensions](./.vscode/extensions.json)
+  - [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) - Vue 3 `<script setup>` IDE support
+  - [ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)
+  - [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode)
+
+### Coding Style
+
+- Use Composition API with [`<script setup>` SFC syntax](https://vuejs.org/guide/scaling-up/sfc.html)
+- [ESLint](https://eslint.org) with [eslint-plugin-vue](https://vuejs.org/guide/scaling-up/tooling.html#linting) - official set of linting rules.
+- [Prettier](https://prettier.io) with [@vue/eslint-config-prettier](https://vuejs.org/guide/scaling-up/tooling.html#formatting) - format without conflicting with eslint rules.
+
+### Typescript
+
+This project allows JS, and strict mode is turned off. Update `tsconfig.ts` as required.
+
+```json
+{
+  "compilerOptions": {
+    // ...
+    "strict": false,
+    "allowJs": true
+  }
+}
+```
+
+## Community
+
+- [Vue Designer Community](https://discord.gg/BYp45Nnu5T)

env.d.ts

@@ -0,0 +1 @@
+/// <reference types="vite/client" />

index.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" href="/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vue Designer</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>

netlify.toml

@@ -0,0 +1,6 @@
+[build]
+command = "npm run build"
+publish = "dist"
+
+[build.environment]
+NODE_VERSION = "20.14.0"