众所周知,在后端启动的时候,他们的控制台会输出一些自定义的内容,我们想在前端启动的时候在控制台怎么输出呢
第一步先下载vite的插件yarn add picocolors\npm i picocolors
第二步在你的vite项目里的src目录下创建plugin文件夹从这个文件夹里管理你所有的vit插件,这个时候要创建我们的插件文件了名字为picocolors.js
创建结束后把` import colors from 'picocolors';
export default function vitePluginVueMonitor () {
return {
apply: 'serve',
enforce: 'pre',
configureServer(server) {
const print = server.printUrls;
server.printUrls = () => {
const network = server.resolvedUrls?.network[0];
const local = server.resolvedUrls?.local[0];
if (!network && !local) {
console.log(colors.red('获取IP地址失败,请检查vite.config.ts文件中server.host配置是否正确!\n'))
} else {
console.info(colors.green(`
你要输出的自定义内容
░░ ░░ ░░░░ ░░░░░░ ░░░░░░
`))
print();
}
}
}
}
} ` 这段代码复制进去后把你这个插件文件添加到你的vite文件里就ok了