chore: 基础 prettier

.prettierignore

@@ -0,0 +1,15 @@
+# prettier 会忽略的文件
+
+/dist/*
+.local
+.output.js
+/node_modules/**
+
+**/*.svg
+**/*.sh
+
+/public/*
+
+.DS_Store
+*.local
+*.log

package.json

@@ -17,6 +17,7 @@
   "devDependencies": {
     "@types/node": "^17.0.25",
     "@vitejs/plugin-vue": "^2.3.1",
+    "prettier": "^2.6.2",
     "typescript": "^4.6.3",
     "unplugin-auto-import": "^0.7.1",
     "unplugin-vue-components": "^0.19.3",

prettier.config.js

@@ -0,0 +1,21 @@
+/** 配置项文档：https://prettier.io/docs/en/configuration.html */
+module.exports = {
+  /** 每一行的宽度 */
+  printWidth: 120,
+  /** tab 健的空格数 */
+  tabWidth: 2,
+  /** 在对象中的括号之间用空格来间隔 */
+  bracketSpacing: true,
+  /** 箭头函数的参数无论有几个，都要括号包裹 */
+  arrowParens: 'always',
+  /** 换行符的使用 */
+  endOfLine: 'auto',
+  /** 采用单引号 */
+  singleQuote: true,
+  /** 对象或者数组的最后一个元素后面是否要加逗号 */
+  trailingComma: 'all',
+  /** 不加分号 */
+  semi: false,
+  /** 不使用 tab 格式化 */
+  useTabs: false,
+}

src/App.vue

@@ -1,15 +1,16 @@
 <script setup lang="ts">
 // This starter template is using Vue 3 <script setup> SFCs
 // Check out https://vuejs.org/api/sfc-script-setup.html#script-setup
-import HelloWorld from "./components/HelloWorld.vue"
-console.log("测试 console.log")
-console.info("测试 console.info")
-console.error("测试 console.error")
-console.info("测试 VITE_BASE_API", import.meta.env.VITE_BASE_API)
-console.info("测试 MODE", import.meta.env.MODE)
-console.info("测试 BASE_URL", import.meta.env.BASE_URL)
-console.info("测试 DEV", import.meta.env.DEV)
-console.info("测试 PROD", import.meta.env.PROD)
+import HelloWorld from './components/HelloWorld.vue'
+console.log('测试 console.log')
+console.info('测试 console.info')
+console.error('测试 console.error')
+console.info('测试 VITE_BASE_API', import.meta.env.VITE_BASE_API)
+console.info('测试 MODE', import.meta.env.MODE)
+console.info('测试 BASE_URL', import.meta.env.BASE_URL)
+console.info('测试 DEV', import.meta.env.DEV)
+console.info('测试 PROD', import.meta.env.PROD)
+const aaa = { a: 5, b: 1 }
 </script>
 
 <template>

src/types/components.d.ts

@@ -5,7 +5,6 @@ import '@vue/runtime-core'
 
 declare module '@vue/runtime-core' {
   export interface GlobalComponents {
-    ElButton: typeof import('element-plus/es')['ElButton']
     HelloWorld: typeof import('./../components/HelloWorld.vue')['default']
   }
 }

vite.config.ts

@@ -1,9 +1,9 @@
-import { ConfigEnv, UserConfigExport } from "vite"
-import { resolve } from "path"
-import vue from "@vitejs/plugin-vue"
-import AutoImport from "unplugin-auto-import/vite"
-import Components from "unplugin-vue-components/vite"
-import { ElementPlusResolver } from "unplugin-vue-components/resolvers"
+import { ConfigEnv, UserConfigExport } from 'vite'
+import { resolve } from 'path'
+import vue from '@vitejs/plugin-vue'
+import AutoImport from 'unplugin-auto-import/vite'
+import Components from 'unplugin-vue-components/vite'
+import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
 
 /** 配置项文档：https://vitejs.dev/config */
 export default (env: ConfigEnv): UserConfigExport => {
@@ -11,7 +11,7 @@ export default (env: ConfigEnv): UserConfigExport => {
     resolve: {
       alias: {
         /** @ 符号指向 src 目录 */
-        "@": resolve(__dirname, "./src"),
+        '@': resolve(__dirname, './src'),
       },
     },
     server: {
@@ -29,12 +29,12 @@ export default (env: ConfigEnv): UserConfigExport => {
       strictPort: true,
       /** 接口代理 */
       proxy: {
-        "/mock-api": {
-          target: "https://vue-typescript-admin-mock-server-armour.vercel.app/mock-api",
+        '/mock-api': {
+          target: 'https://vue-typescript-admin-mock-server-armour.vercel.app/mock-api',
           ws: true,
           /** 是否允许跨域 */
           changeOrigin: true,
-          rewrite: (path) => path.replace("/mock-api", ""),
+          rewrite: (path) => path.replace('/mock-api', ''),
         },
       },
     },
@@ -43,26 +43,26 @@ export default (env: ConfigEnv): UserConfigExport => {
       /** 消除打包大小超过 500kb 警告 */
       chunkSizeWarningLimit: 2000,
       /** vite 2.6.x 以上需要配置 minify: terser，terserOptions 才能生效 */
-      minify: "terser",
+      minify: 'terser',
       /** 在 build 代码时移除 console.log、debugger 和 注释 */
       terserOptions: {
         compress: {
           drop_console: false,
           drop_debugger: true,
-          pure_funcs: ["console.log"],
+          pure_funcs: ['console.log'],
         },
         output: {
           /** 删除注释 */
           comments: false,
         },
       },
-      assetsDir: "static/assets",
+      assetsDir: 'static/assets',
       /** 静态资源打包到 dist 下的不同目录 */
       rollupOptions: {
         output: {
-          chunkFileNames: "static/js/[name]-[hash].js",
-          entryFileNames: "static/js/[name]-[hash].js",
-          assetFileNames: "static/[ext]/[name]-[hash].[ext]",
+          chunkFileNames: 'static/js/[name]-[hash].js',
+          entryFileNames: 'static/js/[name]-[hash].js',
+          assetFileNames: 'static/[ext]/[name]-[hash].[ext]',
         },
       },
     },