我花了很长时间才弄明白如何在我的Svelte项目中从Vite构建一个.js文件,其中包括我的Svelte项目中所有构建的javascript和CSS。默认情况下,Vite将应用程序捆绑成一个html文件(这是可以的),两个.js文件(为什么??)和一个.css文件(只是希望将其捆绑成一个js文件)。
我运行了这个非常基本的命令来获得一个入门项目:
第一个月
我试着添加了几个插件,但没有一个达到我想要的效果。主要是,我发现的插件似乎想创建一个包含所有内容的HTML文件。看起来PostCSS可能会有所帮助,但我不知道我可以通过Vite设置什么配置来让它做我想要的事情。
什么是神奇的插件和配置集,将输出一个单一的HTML文件与一个单一的js文件,呈现我的苗条的应用程序和它的CSS到页面?
6条答案
按热度按时间3zwjbxry1#
两步,
vite-plugin-css-injected-by-js
将css注入js资产。最终结果,
u7up0aaq2#
我为这个问题创建了一个样板Vite项目:
https://github.com/mvsde/svelte-micro-frontend
也许配置对您的情况有帮助:
9bfwbjaz3#
如果您正在寻找一个解决方案,您可能需要看看vite-plugin-singlefile。
waxmsbnn4#
这并不是vite的开箱即用,但是你可以编写一个快速插件来完成这个任务
y3bcpkx15#
我遇到了同样的问题,并能够通过编辑
vite.config.ts
修复,如下所示,在vite@2.3.8
上测试bqjvbblv6#
如果使用的是Svelte,则可以使用
emitCss
: