feat: add codelint, tests, githook

Author: LHRUN

.commitlintrc.cjs

@@ -0,0 +1,3 @@
+module.exports = {
+  extends: ["@commitlint/config-conventional"]
+}

.eslintignore

@@ -0,0 +1,13 @@
+*.sh
+node_modules
+*.md
+*.woff
+*.ttf
+.vscode
+.idea
+dist
+/public
+/docs
+.husky
+.local
+/bin

.eslintrc.cjs

@@ -0,0 +1,38 @@
+module.exports = {
+  env: {
+    browser: true,
+    es2021: true,
+    commonjs: true,
+    node: true
+  },
+  extends: [
+    'eslint:recommended',
+    'plugin:vue/vue3-essential',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:prettier/recommended'
+  ],
+  overrides: [],
+  parser: 'vue-eslint-parser',
+  parserOptions: {
+    ecmaVersion: 'latest',
+    sourceType: 'module',
+    parser: '@typescript-eslint/parser'
+  },
+  plugins: ['vue', '@typescript-eslint', 'prettier'],
+  rules: {
+    'prettier/prettier': 'error',
+    'arrow-body-style': 'off',
+    'prefer-arrow-callback': 'off',
+    '@typescript-eslint/ban-types': [
+      'error',
+      {
+        extendDefaults: true,
+        types: {
+          '{}': false
+        }
+      }
+    ],
+    '@typescript-eslint/no-var-requires': 0,
+    'vue/multi-word-component-names': 'off'
+  }
+}

.husky/commit-msg

@@ -0,0 +1,4 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+npx --no-install commitlint -e 

.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+npx lint-staged

.prettierrc.cjs

@@ -0,0 +1,9 @@
+module.exports = {
+  printWidth: 80,
+  tabWidth: 2,
+  useTabs: false,
+  singleQuote: true,
+  semi: false,
+  trailingComma: "none",
+  bracketSpacing: true
+}

README.md

@@ -5,13 +5,18 @@
 + dev
 ```
 pnpm install
-pnpm run dev
+pnpm dev
 ```
 + prod
 ```
 pnpm install
-pnpm run build
-pnpm run serve
+pnpm build
+pnpm serve
+```
++ test
+```
+pnpm install
+pnpm test
 ```
 
 ### File list
@@ -24,10 +29,15 @@ pnpm run serve
 │  ├─ types
 │  ├─ App.vue
 │  ├─ entry-client.ts // mount dom && replace data
-│  ├─ entry-server.js // change html strings and static resources
+│  ├─ entry-server.js // replace html strings and static resources
 │  └─ main.ts // create app
 │
-├─ server.js // server startup file
+├─ __tests__
+│  ├─ test-server // test server startup file
+│  └─ vuessr.spec.ts // vue ssr test
+│
+├─ server.js // server file
+├─ start-server.js // server startup file
 ├─ vite.config.ts
 // ...
 ```

__tests__/ssr.spec.ts

@@ -0,0 +1,44 @@
+import puppeteer, { Browser, Page } from 'puppeteer'
+import { server, testPort, ServerOptions } from './test-server'
+import { beforeAll, afterAll, expect, test } from 'vitest'
+
+let serverConfig: null | ServerOptions = null
+let browser: null | Browser = null // 浏览器实例
+let page: null | Page = null // 页面实例
+
+const url = (path: string) => `http://localhost:${testPort}${path}`
+
+beforeAll(async () => {
+  serverConfig = await server()
+  browser = await puppeteer.launch()
+  page = await browser.newPage()
+})
+afterAll(async () => {
+  if (page) {
+    await page.close()
+  }
+  if (browser) {
+    await browser.close()
+  }
+  if (serverConfig) {
+    await serverConfig.close()
+  }
+})
+
+test('goto home', async () => {
+  if (page) {
+    await page.goto(url('/'))
+    const content = await page.content()
+    expect(content).toMatch('HOME')
+  }
+})
+
+test('goto about', async () => {
+  if (page) {
+    await page.goto(url('/about'))
+    const content = await page.content()
+    expect(content).toMatch('1')
+    await page.click('#count')
+    expect(content).toMatch('2')
+  }
+})

__tests__/test-server.ts

@@ -0,0 +1,29 @@
+import createServer from '../server.js'
+
+export const testPort = 5120
+
+export interface ServerOptions {
+  close: () => Promise<void>
+}
+
+export async function server() {
+  const { app } = await createServer(true)
+
+  return new Promise<ServerOptions>((resolve, reject) => {
+    try {
+      const server = app.listen(testPort, () => {
+        console.log(`test service started, port: ${testPort}`)
+      })
+      resolve({
+        async close() {
+          await new Promise((resolve) => {
+            server.close(resolve)
+            console.log(`test service closed, port: ${testPort}`)
+          })
+        }
+      })
+    } catch (error) {
+      reject(error)
+    }
+  })
+}

package.json

@@ -4,11 +4,14 @@
   "version": "0.0.0",
   "type": "module",
   "scripts": {
-    "dev": "node server",
+    "dev": "node start-server",
     "build": "npm run build:client && npm run build:server",
     "build:client": "vite build --ssrManifest --outDir dist/client",
     "build:server": "vite build --ssr src/entry-server.js --outDir dist/server",
-    "serve": "cross-env NODE_ENV=production node server"
+    "serve": "cross-env NODE_ENV=production node start-server",
+    "test": "vitest",
+    "lint": "pnpm lint:code",
+    "lint:code": "eslint --ext .js,.jsx,.ts,.tsx --fix --quiet ./"
   },
   "dependencies": {
     "compression": "^1.7.4",
@@ -19,11 +22,31 @@
     "vue-router": "4"
   },
   "devDependencies": {
+    "@commitlint/cli": "^17.4.2",
+    "@commitlint/config-conventional": "^17.4.2",
     "@types/express": "^4.17.13",
     "@types/node": "^18.7.13",
+    "@typescript-eslint/eslint-plugin": "^5.48.2",
+    "@typescript-eslint/parser": "^5.48.2",
     "@vitejs/plugin-vue": "^3.0.3",
+    "eslint": "^8.32.0",
+    "eslint-config-prettier": "^8.6.0",
+    "eslint-plugin-prettier": "^4.2.1",
+    "eslint-plugin-vue": "^9.9.0",
+    "husky": "^8.0.3",
+    "lint-staged": "^13.1.0",
+    "prettier": "^2.8.3",
+    "puppeteer": "^19.5.2",
     "typescript": "^4.6.4",
     "vite": "^3.0.7",
+    "vite-plugin-eslint": "^1.8.1",
+    "vitest": "^0.27.2",
+    "vue-eslint-parser": "^9.1.0",
     "vue-tsc": "^0.39.5"
+  },
+  "lint-staged": {
+    "*.{js,jsx,tsx,ts}": [
+      "npm run lint"
+    ]
   }
-}
+}