feat: next

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+  "typescript.tsdk": "node_modules/typescript/lib"
+}

LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2023 Bistroo
+Copyright (c) 2023 Youri van Mill
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -1,6 +1,6 @@
-# SSR for Vue
+# vite-plugin-vue-ssr
 
-Minimalistic wrapper to run SSR Vue apps, based on Vite
+Vite plugin to develop Vue 3 SSR apps
 
 ## Features
 * HMR support
@@ -14,47 +14,55 @@ Minimalistic wrapper to run SSR Vue apps, based on Vite
 ### Installation
 
 ```sh
-pnpm install @bistroo/vue-ssr -D
+pnpm install vite-plugin-vue-ssr -D
 ```
 
-Add the following scripts
-
-```json
-"scripts": {
-  "dev": "vue-ssr",
-  "build": "vue-ssr build",
-  "start": "vue-ssr start"
-},
-```
-
-> The `vue-ssr` command creates a dev server with HMR enabled.
-To create a production ready build, use `vue-ssr build`. After creating a build, use `vue-ssr start` to serve the build with Express.
-
-### Configuration
-
-Create a vue-ssr.config.ts
-
-```typescript
-import { defineConfig } from '@bistroo/vue-ssr'
+vite.config.ts
+```ts
+import { defineConfig } from 'vite'
+import vue from '@vitejs/plugin-vue'
+import vueSsr from 'vite-plugin-vue-ssr/plugin'
 import { fileURLToPath } from 'node:url'
 
 export default defineConfig({
-  vite: {
-    resolve: {
-      alias: {
-        '@': fileURLToPath(new URL('./src', import.meta.url)),
-      },
+  plugins: [
+    vue(),
+    vueSsr(),
+  ],
+  resolve: {
+    alias: {
+      '@': fileURLToPath(new URL('./src', import.meta.url)),
     },
   },
 })
-```
 
-> Use the `vite` property with caution.
+```
 
 ### Usage
 
+Add the build commands to your `package.json` file.
+
+```json
+{
+  "scripts": {
+    "dev": "vite",
+    "build": "pnpm run build:client && pnpm run build:server",
+    "build:client": "vite build --ssrManifest --outDir dist/client",
+    "build:server": "vite build --ssr src/main.ts --outDir dist/server"
+  }
+}
+```
+
+This will build a client and server bundle.
+
+Use the `vite` command to start a SSR enabled dev server.
+
+> Disabling SSR in vite will enable to build a SPA version.
+
+The `main.ts` file should export the imported vueSSR function.
+
 ```ts
-import { vueSSR } from '@bistroo/vue-ssr'
+import { vueSSR } from 'vite-plugin-vue-ssr'
 
 import App from '@/App.vue'
 
@@ -71,9 +79,7 @@ const routes = [
 export default vueSSR(App, { routes })
 ```
 
-The `main.ts` file should export the imported vueSSR function.
-
-Pinia is supported by using the `app` and `state` property inside the callback.
+Pinia/Vuex is supported by using the `app` and `state` property inside the callback.
 
 ```typescript
 export default vueSSR(App, { routes }, ({ app, state }) => {

example/package.json

@@ -4,19 +4,24 @@
   "version": "0.0.0",
   "type": "module",
   "scripts": {
-    "dev": "vue-ssr",
-    "build": "vue-ssr build",
-    "start": "vue-ssr start"
+    "dev": "vite",
+    "build": "pnpm run build:client && pnpm run build:server",
+    "build:client": "vite build --ssrManifest --outDir dist/client",
+    "build:server": "vite build --ssr src/main.ts --outDir dist/server"
   },
   "dependencies": {
-    "@vueuse/head": "^1.1.26",
+    "@vueuse/head": "^1.3.1",
     "pinia": "^2.1.6",
     "vue": "^3.3.4",
     "vue-router": "^4.2.4"
   },
   "devDependencies": {
-    "@bistroo/vue-ssr": "workspace:*",
-    "@vue/tsconfig": "^0.1.3",
-    "typescript": "^4.9.4"
+    "vite-plugin-vue-ssr": "workspace:*",
+    "@tsconfig/node18": "^18.2.0",
+    "@types/node": "^18.17.5",
+    "@vitejs/plugin-vue": "^4.2.3",
+    "@vue/tsconfig": "^0.4.0",
+    "typescript": "~5.1.6",
+    "vite": "^4.4.9"
   }
 }

example/src/main.ts

@@ -1,4 +1,4 @@
-import { vueSSR } from '@bistroo/vue-ssr'
+import { vueSSR } from 'vite-plugin-vue-ssr'
 import { createPinia } from 'pinia'
 
 import App from '@/App.vue'
@@ -10,14 +10,15 @@ const routes = [
     path: '/',
     name: 'counter',
     component: Counter,
-  }
+  },
 ]
 
 export default vueSSR(App, { routes }, ({ app, state }) => {
   const pinia = createPinia()
-
   app.use(pinia)
 
+  console.log(import.meta.env.SSR)
+
   if (import.meta.env.SSR) {
     state.value = pinia.state.value
   } else {

example/src/stores/counter.ts

@@ -1,7 +1,7 @@
 import { defineStore } from 'pinia'
 
 export const useCounterStore = defineStore('counter', {
-  state: () => ({ count: 0 }),
+  state: () => ({ count: 11 }),
   getters: {
     doubleCount: (state) => state.count * 2,
   },

example/tsconfig.app.json

@@ -0,0 +1,12 @@
+{
+  "extends": "@vue/tsconfig/tsconfig.dom.json",
+  "include": ["env.d.ts", "src/**/*", "src/**/*.vue"],
+  "exclude": ["src/**/__tests__/*"],
+  "compilerOptions": {
+    "composite": true,
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  }
+}

example/tsconfig.json

@@ -1,16 +1,11 @@
 {
-  "extends": "@vue/tsconfig/tsconfig.web.json",
-  "include": ["env.d.ts", "src/**/*", "src/**/*.vue"],
-  "compilerOptions": {
-    "baseUrl": ".",
-    "paths": {
-      "@/*": ["./src/*"]
-    }
-  },
-
+  "files": [],
   "references": [
     {
-      "path": "./tsconfig.config.json"
+      "path": "./tsconfig.node.json"
+    },
+    {
+      "path": "./tsconfig.app.json"
     }
   ]
 }

example/tsconfig.node.json

@@ -0,0 +1,16 @@
+{
+  "extends": "@tsconfig/node18/tsconfig.json",
+  "include": [
+    "vite.config.*",
+    "vitest.config.*",
+    "cypress.config.*",
+    "nightwatch.conf.*",
+    "playwright.config.*"
+  ],
+  "compilerOptions": {
+    "composite": true,
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+    "types": ["node"]
+  }
+}

example/vite.config.ts

@@ -0,0 +1,16 @@
+import { defineConfig } from 'vite'
+import vueSsr from 'vite-plugin-vue-ssr/plugin'
+import vue from '@vitejs/plugin-vue'
+import { fileURLToPath } from 'node:url'
+
+export default defineConfig({
+  plugins: [
+    vueSsr(),
+    vue(),
+  ],
+  resolve: {
+    alias: {
+      '@': fileURLToPath(new URL('./src', import.meta.url)),
+    },
+  },
+})

package.json

@@ -1,29 +1,28 @@
 {
-  "name": "@bistroo/vue-ssr",
-  "version": "0.0.13",
+  "name": "vite-plugin-vue-ssr",
+  "version": "0.0.0",
   "type": "module",
   "license": "MIT",
-  "description": "Minimalistic wrapper to run SSR Vue apps",
-  "bin": {
-    "vue-ssr": "bin/vue-ssr.js"
-  },
+  "description": "Vite plugin to develop Vue 3 SSR apps",
   "bugs": {
-    "url": "https://github.com/bistroo/vue-ssr/issues"
+    "url": "https://github.com/yooouuri/vite-plugin-vue-ssr/issues"
   },
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/bistroo/vue-ssr.git"
+    "url": "git+https://github.com/yooouuri/vite-plugin-vue-ssr.git"
   },
-  "types": "./dist/index.d.ts",
   "exports": {
     ".": {
       "import": "./dist/index.js",
       "types": "./dist/index.d.ts"
+    },
+    "./plugin": {
+      "import": "./dist/plugin/index.js",
+      "types": "./dist/plugin/index.d.ts"
     }
   },
   "files": [
-    "dist",
-    "bin"
+    "dist"
   ],
   "scripts": {
     "build": "rollup -c",
@@ -41,32 +40,28 @@
     "@babel/traverse": "^7.21.4",
     "@babel/types": "^7.21.4",
     "@nuxt/devalue": "^2.0.2",
-    "@vitejs/plugin-vue": "^4.2.3",
-    "c12": "^1.4.2",
+    "@types/express": "^4.17.17",
+    "@unhead/schema": "^1.3.9",
     "cheerio": "1.0.0-rc.12",
-    "compression": "^1.7.4",
-    "cookie-parser": "^1.4.6",
-    "express": "^4.18.2",
-    "magicast": "^0.2.10",
-    "mri": "^1.2.0",
-    "serve-static": "^1.15.0",
-    "vite": "^4.4.7"
+    "cookie-parser": "^1.4.6"
   },
   "devDependencies": {
-    "@types/express": "^4.17.17",
     "@types/node": "^18.17.1",
-    "@unhead/schema": "^1.1.35",
-    "@vueuse/head": "^1.1.26",
+    "@vueuse/head": "^1.3.1",
     "esbuild": "^0.17.19",
+    "pinia": "^2.1.6",
     "rollup": "^3.27.0",
     "rollup-plugin-dts": "^5.3.1",
     "rollup-plugin-esbuild": "^5.0.0",
     "typescript": "^5.1.6",
+    "vite": "^4.4.9",
     "vue": "^3.3.4",
     "vue-router": "^4.2.4"
   },
   "peerDependencies": {
-    "@vueuse/head": "^1.1.26",
+    "@vueuse/head": "^1.3.1",
+    "pinia": "^2.1.6",
+    "vite": "^4.4.9",
     "vue": "^3.3.4",
     "vue-router": "^4.2.4"
   }