最近在学付金权老师的vite课,讲的颇为不错,可惜我现在不找工作,所以没法买面试题支持他咯,学到vite插件的vitealiases时,按照视频里的代码写了一下,yarn dev后,发现报如下错误。
我的(类似于,只是多写了基本配置和扩展配置,看过视频的都懂)
import {defineConfig} from "vite"
//import { ViteAliases } from "vite-aliases";
import { ViteAliases } from 'vite-aliases';
//const postcssPresetEnv =require("postcss-preset-env")
export default defineConfig({
optimizeDeps:{
exclude:[],
},
envPrefix:"ENV_",//配置vite注入客户端环境变量
css:{//对css的行为进行配置
//modules配置最终会丢给postcss module
modules:{
localsConvention:"camelCase",
scopeBehaviour:"local",
//generateScopedName:"[name]_[local]_[hash:5]",
/*generateScopedName:(name,filename,css)=>{
("name",name,"filename",filename,"css",css);
return `${name}_${().toString(36).substr(3,8)}`;
},*/
hashPrefix:"hello",
globalModulePaths:["./"],//代表不想参与css模块化编码的模块。
},
preprocessorOptions:{//key+config key代表预处理器的名
less:{//整个的配置对象都会最终给到
math:"always",
globalVars:{
mainColor:"red",
}
},
},
devSourcemap:true,
/*postcss:{
//plugins:[postcssPresetEnv()]
}*/
},
build:{
rollupOptions:{
output:{
assetFileNames:"[hash].[name].[ext]"
}
},
assetsInlineLimit:4096,
//outDir:"testDist"
assetsDir:"static"
},
plugins:[
ViteAliases()
],
})
报错信息:
$ vite
X [ERROR] [plugin externalize-deps] Failed to resolve entry for package “vite-aliases”. The package may have incorrect main/module/exports specified in its : No
known conditions for “.” entry in “vite-aliases” package
node_modules/esbuild/lib/:1327:27:
1327 │ let result = await callback({
╵ ^
at packageEntryFailure (file:///C:/Users/Administrator/Desktop/testvite/node_modules/vite/dist/node/chunks/:34096:11)
at resolvePackageEntry (file:///C:/Users/Administrator/Desktop/testvite/node_modules/vite/dist/node/chunks/:34091:9)
at tryNodeResolve (file:///C:/Users/Administrator/Desktop/testvite/node_modules/vite/dist/node/chunks/:33834:20)
at file:///C:/Users/Administrator/Desktop/testvite/node_modules/vite/dist/node/chunks/:62782:40
at -resolve (C:\Users\Administrator\Desktop\testvite\node_modules\esbuild\lib\:1327:28)
at handleRequest (C:\Users\Administrator\Desktop\testvite\node_modules\esbuild\lib\:697:19)
at handleIncomingPacket (C:\Users\Administrator\Desktop\testvite\node_modules\esbuild\lib\:719:7)
at (C:\Users\Administrator\Desktop\testvite\node_modules\esbuild\lib\:647:7)
at (node:events:527:28)
at addChunk (node:internal/streams/readable:315:12)
This error came from the “onResolve” callback registered here:
node_modules/esbuild/lib/:1251:20:
1251 │ let promise = setup({
╵ ^
at setup (file:///C:/Users/Administrator/Desktop/testvite/node_modules/vite/dist/node/chunks/:62772:27)
at handlePlugins (C:\Users\Administrator\Desktop\testvite\node_modules\esbuild\lib\:1251:21)
at buildOrServeImpl (C:\Users\Administrator\Desktop\testvite\node_modules\esbuild\lib\:942:5)
at (C:\Users\Administrator\Desktop\testv
搞了半天搞不懂,拿去问我哥了,他帮我看了下,
把import { ViteAliases } from ‘vite-aliases’;改成
import { ViteAliases } from ‘./node_modules/vite-aliases’;就可以了,可能是vite和webpack搜索模块的差异导致的吧,以后遇到问题再说,现在先不钻牛角尖,遇到问题再肝源码。