Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

是我配置错了吗?无法使用 #811

Open
5 tasks done
vergil-lai opened this issue Dec 24, 2024 · 0 comments
Open
5 tasks done

是我配置错了吗?无法使用 #811

vergil-lai opened this issue Dec 24, 2024 · 0 comments

Comments

@vergil-lai
Copy link

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

开发环境:
System:
    OS: macOS 15.2
    CPU: (10) arm64 Apple M1 Pro
    Memory: 61.94 MB / 32.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.11.1 - ~/.nvm/versions/node/v20.11.1/bin/node
    npm: 10.2.4 - ~/.nvm/versions/node/v20.11.1/bin/npm
    pnpm: 9.14.4 - ~/.nvm/versions/node/v20.11.1/bin/pnpm
  Browsers:
    Chrome: 131.0.6778.205
    Safari: 18.2


服务器环境:

Need to install the following packages:
[email protected]
Ok to proceed? (y)


  System:
    OS: Linux 6.8 Ubuntu 24.04.1 LTS 24.04.1 LTS (Noble Numbat)
    CPU: (4) x64 Intel(R) Xeon(R) Platinum
    Memory: 5.99 GB / 7.10 GB
    Container: Yes
    Shell: 5.9 - /usr/bin/zsh
  Binaries:
    Node: 22.12.0 - ~/.nvm/versions/node/v22.12.0/bin/node
    npm: 10.9.0 - ~/.nvm/versions/node/v22.12.0/bin/npm
    pnpm: 9.15.1 - ~/.nvm/versions/node/v22.12.0/bin/pnpm


以上都有问题

Used Package Manager

pnpm

Validations

  • Follow our Code of Conduct
  • Read the Contributing Guide.
  • Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
  • Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead.
  • The provided reproduction is a minimal reproducible of the bug.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant