Yinux/unibest
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

build: 处理vite.config.ts

Browse Source
This commit is contained in:
Burt 2023-12-21 17:30:49 +08:00
parent a1eecdeb38
commit a87775137c
7 changed files with 3628 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
index.html
View File

@ -1,13 +1,17 @@
<!DOCTYPE html> <!doctype html>
<html> <html build-date="%BUILD_DATE%">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<script> <script>
var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') || var coverSupport =
CSS.supports('top: constant(a)')) 'CSS' in window &&
typeof CSS.supports === 'function' &&
(CSS.supports('top: env(a)') || CSS.supports('top: constant(a)'))
document.write( document.write(
'<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' + '<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
(coverSupport ? ', viewport-fit=cover' : '') + '" />') (coverSupport ? ', viewport-fit=cover' : '') +
'" />',
)
</script> </script>
<title></title> <title></title>
<!--preload-links--> <!--preload-links-->

12
package.json
View File

@ -65,6 +65,7 @@
"@dcloudio/uni-mp-toutiao": "3.0.0-3081220230817001", "@dcloudio/uni-mp-toutiao": "3.0.0-3081220230817001",
"@dcloudio/uni-mp-weixin": "3.0.0-3081220230817001", "@dcloudio/uni-mp-weixin": "3.0.0-3081220230817001",
"@dcloudio/uni-quickapp-webview": "3.0.0-3081220230817001", "@dcloudio/uni-quickapp-webview": "3.0.0-3081220230817001",
"dayjs": "^1.11.10",
"vue": "3.2.47", "vue": "3.2.47",
"vue-i18n": "^9.1.9" "vue-i18n": "^9.1.9"
}, },
@ -80,6 +81,7 @@
"@typescript-eslint/parser": "^6.15.0", "@typescript-eslint/parser": "^6.15.0",
"@vue/runtime-core": "^3.2.45", "@vue/runtime-core": "^3.2.45",
"@vue/tsconfig": "^0.1.3", "@vue/tsconfig": "^0.1.3",
"autoprefixer": "^10.4.16",
"commitlint": "^18.4.3", "commitlint": "^18.4.3",
"eslint": "^8.56.0", "eslint": "^8.56.0",
"eslint-config-airbnb-base": "^15.0.0", "eslint-config-airbnb-base": "^15.0.0",
@ -93,6 +95,7 @@
"postcss": "^8.4.32", "postcss": "^8.4.32",
"postcss-html": "^1.5.0", "postcss-html": "^1.5.0",
"postcss-scss": "^4.0.9", "postcss-scss": "^4.0.9",
"rollup-plugin-visualizer": "^5.11.0",
"sass": "^1.69.5", "sass": "^1.69.5",
"stylelint": "^16.0.2", "stylelint": "^16.0.2",
"stylelint-config-html": "^1.1.0", "stylelint-config-html": "^1.1.0",
@ -101,7 +104,16 @@
"stylelint-config-standard": "^35.0.0", "stylelint-config-standard": "^35.0.0",
"stylelint-config-standard-scss": "^12.0.0", "stylelint-config-standard-scss": "^12.0.0",
"typescript": "^4.9.4", "typescript": "^4.9.4",
"unocss": "^0.58.0",
"unplugin-auto-import": "^0.17.2",
"unplugin-vue-components": "^0.26.0",
"vite": "4.1.4", "vite": "4.1.4",
"vite-plugin-compression": "^0.5.1",
"vite-plugin-imagemin": "^0.6.1",
"vite-plugin-restart": "^0.4.0",
"vite-plugin-svg-icons": "^2.0.1",
"vite-plugin-vue-setup-extend": "^0.4.0",
"vite-svg-loader": "^5.1.0",
"vue-global-api": "^0.4.1", "vue-global-api": "^0.4.1",
"vue-tsc": "^1.0.24" "vue-tsc": "^1.0.24"
} }

3348
pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff

78
src/auto-import.d.ts vendored Normal file
View File

@ -0,0 +1,78 @@
/* eslint-disable */
/* prettier-ignore */
// @ts-nocheck
// noinspection JSUnusedGlobalSymbols
// Generated by unplugin-auto-import
export {}
declare global {
const EffectScope: (typeof import('vue'))['EffectScope']
const computed: (typeof import('vue'))['computed']
const createApp: (typeof import('vue'))['createApp']
const customRef: (typeof import('vue'))['customRef']
const defineAsyncComponent: (typeof import('vue'))['defineAsyncComponent']
const defineComponent: (typeof import('vue'))['defineComponent']
const effectScope: (typeof import('vue'))['effectScope']
const getCurrentInstance: (typeof import('vue'))['getCurrentInstance']
const getCurrentScope: (typeof import('vue'))['getCurrentScope']
const h: (typeof import('vue'))['h']
const inject: (typeof import('vue'))['inject']
const isProxy: (typeof import('vue'))['isProxy']
const isReactive: (typeof import('vue'))['isReactive']
const isReadonly: (typeof import('vue'))['isReadonly']
const isRef: (typeof import('vue'))['isRef']
const markRaw: (typeof import('vue'))['markRaw']
const nextTick: (typeof import('vue'))['nextTick']
const onActivated: (typeof import('vue'))['onActivated']
const onBeforeMount: (typeof import('vue'))['onBeforeMount']
const onBeforeUnmount: (typeof import('vue'))['onBeforeUnmount']
const onBeforeUpdate: (typeof import('vue'))['onBeforeUpdate']
const onDeactivated: (typeof import('vue'))['onDeactivated']
const onErrorCaptured: (typeof import('vue'))['onErrorCaptured']
const onMounted: (typeof import('vue'))['onMounted']
const onRenderTracked: (typeof import('vue'))['onRenderTracked']
const onRenderTriggered: (typeof import('vue'))['onRenderTriggered']
const onScopeDispose: (typeof import('vue'))['onScopeDispose']
const onServerPrefetch: (typeof import('vue'))['onServerPrefetch']
const onUnmounted: (typeof import('vue'))['onUnmounted']
const onUpdated: (typeof import('vue'))['onUpdated']
const provide: (typeof import('vue'))['provide']
const reactive: (typeof import('vue'))['reactive']
const readonly: (typeof import('vue'))['readonly']
const ref: (typeof import('vue'))['ref']
const resolveComponent: (typeof import('vue'))['resolveComponent']
const shallowReactive: (typeof import('vue'))['shallowReactive']
const shallowReadonly: (typeof import('vue'))['shallowReadonly']
const shallowRef: (typeof import('vue'))['shallowRef']
const toRaw: (typeof import('vue'))['toRaw']
const toRef: (typeof import('vue'))['toRef']
const toRefs: (typeof import('vue'))['toRefs']
const toValue: (typeof import('vue'))['toValue']
const triggerRef: (typeof import('vue'))['triggerRef']
const unref: (typeof import('vue'))['unref']
const useAttrs: (typeof import('vue'))['useAttrs']
const useCssModule: (typeof import('vue'))['useCssModule']
const useCssVars: (typeof import('vue'))['useCssVars']
const useSlots: (typeof import('vue'))['useSlots']
const watch: (typeof import('vue'))['watch']
const watchEffect: (typeof import('vue'))['watchEffect']
const watchPostEffect: (typeof import('vue'))['watchPostEffect']
const watchSyncEffect: (typeof import('vue'))['watchSyncEffect']
}
// for type re-export
declare global {
// @ts-ignore
export type {
Component,
ComponentPublicInstance,
ComputedRef,
ExtractDefaultPropTypes,
ExtractPropTypes,
ExtractPublicPropTypes,
InjectionKey,
PropType,
Ref,
VNode,
WritableComputedRef,
} from 'vue'
import('vue')
}

13
src/components.d.ts vendored Normal file
View File

@ -0,0 +1,13 @@
/* eslint-disable */
/* prettier-ignore */
// @ts-nocheck
// Generated by unplugin-vue-components
// Read more: https://github.com/vuejs/core/pull/3399
export {}
declare module 'vue' {
export interface GlobalComponents {
RouterLink: (typeof import('vue-router'))['RouterLink']
RouterView: (typeof import('vue-router'))['RouterView']
}
}

31
uno.config.ts Normal file
View File

@ -0,0 +1,31 @@
// uno.config.ts
import {
defineConfig,
presetAttributify,
presetUno,
presetIcons,
transformerDirectives,
transformerVariantGroup,
} from 'unocss'
export default defineConfig({
presets: [
presetUno(),
// 支持css class属性化，eg: `<button bg="blue-400 hover:blue-500 dark:blue-500 dark:hover:blue-600" text="sm white">attributify Button</button>`
presetAttributify(),
// 支持图标，需要搭配图标库，eg: @iconify-json/carbon, 使用 `<button class="i-carbon-sun dark:i-carbon-moon" />`
presetIcons({
scale: 1.2,
warn: true,
extraProperties: {
display: 'inline-block',
'vertical-align': 'middle',
},
}),
],
transformers: [
transformerDirectives(),
// 支持css class组合，eg: `<div class="hover:(bg-gray-400 font-medium) font-(light mono)">测试 unocss</div>`
transformerVariantGroup(),
],
})

146
vite.config.ts
View File

@ -1,7 +1,143 @@
import { defineConfig } from "vite"; import path from 'node:path'
import uni from "@dcloudio/vite-plugin-uni"; import { defineConfig, loadEnv } from 'vite'
import uni from '@dcloudio/vite-plugin-uni'
import dayjs from 'dayjs'
import svgLoader from 'vite-svg-loader'
import { visualizer } from 'rollup-plugin-visualizer'
import ViteRestart from 'vite-plugin-restart'
import Components from 'unplugin-vue-components/vite'
// ElementPlusResolver,
// AntDesignVueResolver,
// VantResolver,
// HeadlessUiResolver,
// ElementUiResolver
import {} from 'unplugin-vue-components/resolvers'
import AutoImport from 'unplugin-auto-import/vite'
import { createSvgIconsPlugin } from 'vite-plugin-svg-icons'
import viteCompression from 'vite-plugin-compression'
import viteImagemin from 'vite-plugin-imagemin'
import vueSetupExtend from 'vite-plugin-vue-setup-extend'
import UnoCSS from 'unocss/vite'
import autoprefixer from 'autoprefixer'
const htmlPlugin = () => {
return {
name: 'html-transform',
transformIndexHtml(html) {
return html.replace('%BUILD_DATE%', dayjs().format('YYYY-MM-DD HH:mm:ss'))
},
}
}
// https://vitejs.dev/config/ // https://vitejs.dev/config/
export default defineConfig({ export default ({ mode }) => {
plugins: [uni()], // mode: 区分生产环境还是开发环境
}); // process.cwd(): 获取当前文件的目录跟地址
// loadEnv(): 返回当前环境env文件中额外定义的变量
const env = loadEnv(mode, path.resolve(process.cwd(), 'env'))
console.log(env)
return defineConfig({
plugins: [
uni(),
UnoCSS(),
htmlPlugin(),
svgLoader(),
// 打包分析插件
visualizer(),
ViteRestart({
// 通过这个插件，在修改vite.config.js文件则不需要重新运行也生效配置
restart: ['vite.config.js'],
}),
vueSetupExtend(),
// 原先引用组件的时候需要在目标文件里面import相关组件，现在就可以直接使用无需在目标文件import了
Components({
dirs: ['src/components'], // 目标文件夹
extensions: ['vue'], // 文件类型
dts: 'src/components.d.ts', // 输出文件，里面都是一些import的组件键值对
// ui库解析器，也可以自定义，需要安装相关UI库
resolvers: [
// VantResolver(),
// ElementPlusResolver(),
// AntDesignVueResolver(),
// HeadlessUiResolver(),
// ElementUiResolver()
],
}),
AutoImport({
imports: ['vue'],
dts: 'src/auto-import.d.ts',
}),
createSvgIconsPlugin({
// 指定要缓存的文件夹
iconDirs: [path.resolve(process.cwd(), 'src/assets/svg')],
// 指定symbolId格式
symbolId: 'icon-[dir]-[name]',
}),
viteCompression(), // 会多出一些.gz文件，如xxx.js.gz，这里默认是不会删除xxx.js文件的，如果想删除也可以增加配置
// 这个图片压缩插件比较耗时，希望仅在生产环境使用
viteImagemin({
gifsicle: {
// gif图片压缩
optimizationLevel: 3, // 选择1到3之间的优化级别
interlaced: false, // 隔行扫描gif进行渐进式渲染
// colors: 2 // 将每个输出GIF中不同颜色的数量减少到num或更少。数字必须介于2和256之间。
},
optipng: {
// png
optimizationLevel: 7, // 选择0到7之间的优化级别
},
mozjpeg: {
// jpeg
quality: 20, // 压缩质量，范围从0(最差)到100(最佳)。
},
pngquant: {
// png
quality: [0.8, 0.9], // Min和max是介于0(最差)到1(最佳)之间的数字，类似于JPEG。达到或超过最高质量所需的最少量的颜色。如果转换导致质量低于最低质量，图像将不会被保存。
speed: 4, // 压缩速度，1(强力)到11(最快)
},
svgo: {
// svg压缩
plugins: [
{
name: 'removeViewBox',
},
{
name: 'removeEmptyAttrs',
active: false,
},
],
},
}),
],
css: {
postcss: {
plugins: [
autoprefixer({
// 指定目标浏览器
overrideBrowserslist: ['> 1%', 'last 2 versions'],
}),
],
},
},
resolve: {
alias: {
'@': path.join(process.cwd(), './src'),
},
},
server: {
host: '0.0.0.0',
hmr: true,
port: 7001,
// 自定义代理规则
proxy: {
// 选项写法
'/api': {
target: 'http://localhost:6666',
changeOrigin: true,
rewrite: (path) => path.replace(/^\/api/, ''),
},
},
},
})
}