我按照https://learn.microsoft.com/en-us/aspnet/core/blazor/components/css-isolation?view=aspnetcore-8.0#additional-resources中的教程进行操作
现在 CSS 隔离效果很好。
我有一个问题,CSS 隔离样式(就像这个打击)没有缩小。
<link href="{ASSEMBLY NAME}.styles.css" rel="stylesheet">
我考虑过使用像 BuildBundlerMinifier 这样的工具来最小化它。但是,它似乎不是静态文件,而是动态生成的,因此我无法使用第三方工具来最小化它。
有什么方法可以最小化它以使页面访问更快吗?
谢谢。
据我所知,没有内置支持同时实现 css 隔离和缩小,但也许可以找到解决方法。您可以尝试为此目的构建事件,这将涉及指定构建后事件并执行将缩小指定文件的命令。由于该命令将在构建后执行,因此来自 css 隔离的捆绑 css 文件应该存在。
我推荐的工具是
clean-css-cli
(https://www.npmjs.com/package/clean-css-cli),但是您可以使用任何可通过命令运行的库。安装node.js(随 NPM 一起提供),然后使用 NPM 和以下命令全局安装该库:
然后,将构建后事件添加到 .csproj 文件中(请参阅https://learn.microsoft.com/en-us/visualstudio/ide/how-to-specify-build-events-csharp?view=vs-2022了解更多信息)有关构建事件的附加信息)
我承认,这是在黑暗中进行的尝试,我目前无法对此进行测试,但请告诉我它是否有效。您应该检查我指定的路径。请记住,您确实不希望在开发过程中进行缩小(这会无缘无故地使调试变得痛苦)。