trafficstars
starlight@starlightdePro uni-app-vite-vue3-tailwind-vscode-template % pnpm run dev:h5
[email protected] dev:h5 /Users/starlight/Documents/uni-app-vite-vue3-tailwind-vscode-template
uni
请注意运行模式下,因日志输出、sourcemap 以及未压缩源码等原因,性能和包体积,均不及发行模式。
vite是按需编译,运行时点击某个未编译页面会先编译后加载,导致显示较慢,发行后无此问题。
编译器版本:4.57(vue3)
正在编译中...
failed to load config from /Users/starlight/Documents/uni-app-vite-vue3-tailwind-vscode-template/vite.config.ts
error when starting dev server:
Error [ERR_REQUIRE_ESM]: require() of ES Module /Users/starlight/Documents/uni-app-vite-vue3-tailwind-vscode-template/node_modules/.pnpm/[email protected]/node_modules/pkg-types/dist/index.mjs not supported.
Instead change the require of /Users/starlight/Documents/uni-app-vite-vue3-tailwind-vscode-template/node_modules/.pnpm/[email protected]/node_modules/pkg-types/dist/index.mjs to a dynamic import() which is available in all CommonJS modules.
at Object. (/Users/starlight/Documents/uni-app-vite-vue3-tailwind-vscode-template/node_modules/.pnpm/[email protected]/node_modules/unimport/dist/shared/unimport.DUUBMfEV.cjs:14:18)
at require.extensions. [as .js] (file:///Users/starlight/Documents/uni-app-vite-vue3-tailwind-vscode-template/node_modules/.pnpm/[email protected]@[email protected][email protected][email protected]/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:68696:17)
at Object. (/Users/starlight/Documents/uni-app-vite-vue3-tailwind-vscode-template/node_modules/.pnpm/[email protected]/node_modules/unimport/dist/index.cjs:3:17)
at require.extensions. [as .js] (file:///Users/starlight/Documents/uni-app-vite-vue3-tailwind-vscode-template/node_modules/.pnpm/[email protected]@[email protected][email protected][email protected]/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:68696:17)
at Object. (/Users/starlight/Documents/uni-app-vite-vue3-tailwind-vscode-template/node_modules/.pnpm/[email protected]/node_modules/unplugin-auto-import/dist/chunk-6BSQ6ZKC.cjs:2:17)
at require.extensions. [as .js] (file:///Users/starlight/Documents/uni-app-vite-vue3-tailwind-vscode-template/node_modules/.pnpm/[email protected]@[email protected][email protected][email protected]/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:68696:17)
at Object. (/Users/starlight/Documents/uni-app-vite-vue3-tailwind-vscode-template/node_modules/.pnpm/[email protected]/node_modules/unplugin-auto-import/dist/chunk-W4BJKNF7.cjs:3:25)
at require.extensions. [as .js] (file:///Users/starlight/Documents/uni-app-vite-vue3-tailwind-vscode-template/node_modules/.pnpm/[email protected]@[email protected][email protected][email protected]/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:68696:17)
at Object. (/Users/starlight/Documents/uni-app-vite-vue3-tailwind-vscode-template/node_modules/.pnpm/[email protected]/node_modules/unplugin-auto-import/dist/vite.cjs:3:25)
at require.extensions. [as .js] (file:///Users/starlight/Documents/uni-app-vite-vue3-tailwind-vscode-template/node_modules/.pnpm/[email protected]@[email protected][email protected][email protected]/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:68696:17)
at Object. (/Users/starlight/Documents/uni-app-vite-vue3-tailwind-vscode-template/vite.config.ts:37:27)
at require.extensions. [as .js] (file:///Users/starlight/Documents/uni-app-vite-vue3-tailwind-vscode-template/node_modules/.pnpm/[email protected]@[email protected][email protected][email protected]/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:68693:24)
at loadConfigFromBundledFile (file:///Users/starlight/Documents/uni-app-vite-vue3-tailwind-vscode-template/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:68701:21)
at async loadConfigFromFile (file:///Users/starlight/Documents/uni-app-vite-vue3-tailwind-vscode-template/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:68528:28)
at async resolveConfig (file:///Users/starlight/Documents/uni-app-vite-vue3-tailwind-vscode-template/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:68138:28)
at async createServer (file:///Users/starlight/Documents/uni-app-vite-vue3-tailwind-vscode-template/node_modules/.pnpm/[email protected]@[email protected][email protected][email protected]/node_modules/vite/dist/node/chunks/dep-whKeNLxG.js:64655:20)
at async createServer (/Users/starlight/Documents/uni-app-vite-vue3-tailwind-vscode-template/node_modules/.pnpm/@[email protected][email protected][email protected][email protected]_b15902a1d3e4e8bf0fde61f741e3d5d6/node_modules/@dcloudio/vite-plugin-uni/dist/cli/server.js:43:20)
at async CAC.runDev (/Users/starlight/Documents/uni-app-vite-vue3-tailwind-vscode-template/node_modules/.pnpm/@[email protected][email protected][email protected][email protected]_b15902a1d3e4e8bf0fde61f741e3d5d6/node_modules/@dcloudio/vite-plugin-uni/dist/cli/action.js:58:28)
ELIFECYCLE Command failed with exit code 1.
搞定了。题出在 unplugin-auto-import 插件的使用上。 ES 模块与 CommonJS 模块之间的兼容性问题
export default defineConfig(async () => {
// 动态导入 AutoImport
const { default: AutoImport } = await import('unplugin-auto-import/vite')
return {
// uvtw 一定要放在 uni 后面
plugins: [
uni(),
UnifiedViteWeappTailwindcssPlugin({
rem2rpx: true,
disabled: WeappTailwindcssDisabled,
}),
AutoImport({
imports: ['vue', 'uni-app', 'pinia'],
dts: './src/auto-imports.d.ts',
eslintrc: {
enabled: true,
},
}),
],
// 内联 postcss 注册 tailwindcss
css: {
postcss: {
plugins: postcssPlugins,
},
// https://vitejs.dev/config/shared-options.html#css-preprocessoroptions
preprocessorOptions: {
scss: {
silenceDeprecations: ['legacy-js-api'],
},
},
},
}
})
由于 unplugin-auto-import 新版本,改成了 esm 格式,低版本的 Nodejs 不支持混合加载,导致的报错
解决方案:
vite.config.ts 中的 defineConfig 改成异步导入
const { default: AutoImport } = await import('unplugin-auto-import/vite')
- 升级你的 Nodejs 版本到 22+
@yasz 你可以使用LTS 版本的 NodeJs@22 这个版本是 cjs/esm 相互加载兼容的
新的版本已经更改为 import 异步导入,此问题 close