You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
vite.config.base.ts如下:
import { resolve } from 'path';
import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import vueJsx from '@vitejs/plugin-vue-jsx';
import svgLoader from 'vite-svg-loader';
import AutoImport from 'unplugin-auto-import/vite';
import Components from 'unplugin-vue-components/vite';
import { ArcoResolver } from 'unplugin-vue-components/resolvers';
import configArcoStyleImportPlugin from './plugin/arcoStyleImport';
import { mergeConfig } from 'vite';
import baseConfig from './vite.config.base';
import configCompressPlugin from './plugin/compress';
import configVisualizerPlugin from './plugin/visualizer';
import configArcoResolverPlugin from './plugin/arcoResolver';
import configImageminPlugin from './plugin/imagemin';
Describe the bug
我使用的 arco-design-pro-vue 生成的项目结构,如下:
-- config
-- vite.config.base.ts
-- vite.config.prod.ts
-- src
...
package.json
tsconfig.json
vite.config.base.ts如下:
import { resolve } from 'path';
import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import vueJsx from '@vitejs/plugin-vue-jsx';
import svgLoader from 'vite-svg-loader';
import AutoImport from 'unplugin-auto-import/vite';
import Components from 'unplugin-vue-components/vite';
import { ArcoResolver } from 'unplugin-vue-components/resolvers';
import configArcoStyleImportPlugin from './plugin/arcoStyleImport';
export default defineConfig({
plugins: [
vue(),
AutoImport({
dts: true,
include: [
/.[tj]sx?$/, // .ts, .tsx, .js, .jsx
/.vue$/,
/.vue?vue/, // .vue
],
imports: ['vue', 'vue-router', 'pinia'],
resolvers: [ArcoResolver()],
eslintrc: {
enabled: true,
},
}),
Components({
dts: true,
dirs: ['src/components'],
deep: true,
version: 3,
types: [],
resolvers: [
ArcoResolver({
sideEffect: true,
}),
],
}),
vueJsx(),
svgLoader({ svgoConfig: {} }),
configArcoStyleImportPlugin(),
],
resolve: {
alias: [
{
find: '@',
replacement: resolve(__dirname, '../src'),
},
{
find: 'assets',
replacement: resolve(__dirname, '../src/assets'),
},
{
find: 'vue-i18n',
replacement: 'vue-i18n/dist/vue-i18n.cjs.js', // Resolve the i18n warning issue
},
{
find: 'vue',
replacement: 'vue/dist/vue.esm-bundler.js', // compile template
},
],
extensions: ['.ts', '.js', '.vue'],
},
define: {
'VUE_PROD_HYDRATION_MISMATCH_DETAILS': false,
'process.env': {},
},
css: {
preprocessorOptions: {
less: {
modifyVars: {
hack:
true; @import (reference) "${resolve( 'src/assets/style/breakpoint.less' )}";
,},
javascriptEnabled: true,
},
},
},
});
vite.config.prod.ts内容如下:
import { mergeConfig } from 'vite';
import baseConfig from './vite.config.base';
import configCompressPlugin from './plugin/compress';
import configVisualizerPlugin from './plugin/visualizer';
import configArcoResolverPlugin from './plugin/arcoResolver';
import configImageminPlugin from './plugin/imagemin';
export default mergeConfig(
{
mode: 'production',
plugins: [
configCompressPlugin('gzip'),
configVisualizerPlugin(),
configArcoResolverPlugin(),
configImageminPlugin(),
],
build: {
rollupOptions: {
output: {
manualChunks: {
arco: ['@arco-design/web-vue'],
chart: ['echarts', 'vue-echarts'],
vue: ['vue', 'vue-router', 'pinia', '@vueuse/core', 'vue-i18n'],
},
},
},
chunkSizeWarningLimit: 2000,
},
},
baseConfig
);
dts: true
,会生成出来的component.d.ts如下:/* eslint-disable */
// @ts-nocheck
// Generated by unplugin-vue-components
// Read more: vuejs/core#3399
export {}
/* prettier-ignore */
declare module 'vue' {
export interface GlobalComponents {
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']
}
}
如果我
dis: 'src/components.d.ts'
,会生成出两个components.d.ts,一个在src下,一个在根目录在根目录的,和上面的一样,在src的内容如下:
// @ts-nocheck
// Generated by unplugin-vue-components
// Read more: vuejs/core#3399
export {}
/* prettier-ignore */
declare module 'vue' {
export interface GlobalComponents {
AgGridServer: typeof import('./components/ag-grid/AgGridServer.vue')['default']
Block: typeof import('./components/global-setting/block.vue')['default']
Breadcrumb: typeof import('./components/breadcrumb/index.vue')['default']
Chart: typeof import('./components/chart/index.vue')['default']
Footer: typeof import('./components/footer/index.vue')['default']
FormWrapper: typeof import('./components/global-setting/form-wrapper.vue')['default']
GlobalSetting: typeof import('./components/global-setting/index.vue')['default']
List: typeof import('./components/message-box/list.vue')['default']
Menu: typeof import('./components/menu/index.vue')['default']
MessageBox: typeof import('./components/message-box/index.vue')['default']
Navbar: typeof import('./components/navbar/index.vue')['default']
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']
TabBar: typeof import('./components/tab-bar/index.vue')['default']
TabItem: typeof import('./components/tab-bar/tab-item.vue')['default']
}
}
这是正确的。可是也无法自动加载
ps,在开发环境下不会这样,只在build时发生
这是我的script
"scripts": {
"dev": "vite --config ./config/vite.config.dev.ts",
"build": "vue-tsc --noEmit && vite build --config ./config/vite.config.prod.ts",
"report": "cross-env REPORT=true npm run build",
"preview": "npm run build && vite preview --host",
"type:check": "vue-tsc --noEmit --skipLibCheck",
"lint-staged": "npx lint-staged",
"prepare": "husky install"
},
Reproduction
.............
System Info
Used Package Manager
pnpm
Validations
The text was updated successfully, but these errors were encountered: