nuxt3使用记录五:禁用莫名其妙的Tailwind CSS(html文件大大减小)

发现这个问题是因为,今天我突然很好奇,我发现之前构建的自动产生的200.html和404.html足足290k,怎么这么大呢?不是很占用我带宽?

一个啥东西都没有的静态页面,凭啥这么大!所以我就想着手动把他改了,随便返回个page not found就行了

于是我就用编辑器打开这个文件,就好奇是啥玩意这么大,此时看到很奇怪的一个style引用:
在这里插入图片描述
我也没引用这玩意呀,怎么打包个页面,还把开源协议MIT License都给带上,嫌我文件不够大吗?

我全局搜索我的项目,都没有引用这玩意!

于是我就试着把它删掉(删掉后页面直接从290k减到2k,我已经怀疑他把整个css给打包进来了!否则怎么连开源协议都有),看看对页面有啥影响,结果,毫无影响!

然后我检查每个html文件,结果每个文件都有它!

然后我记得在官网看过它,去搜索,果然,这些nuxt自带的一个样式,不过没说为啥要引用他。

然后摸索中,我发现每次运行项目时,都会提示:

Using default Tailwind CSS file                                                                                                                                              nuxt:tailwindcss 20:17:10➜ DevTools: press Shift + Alt + D in the browser (v1.1.5)                     ℹ Tailwind Viewer: http://localhost:10000/_tailwind/ 

平时没注意看,这时候看,猜测是nuxt的默认配置就会加载这玩意,关键我想不明白一个css,为啥要默认加载呢?我的整个页面都没依赖它的样式呀!

然后去nuxt官网和Tailwind CSS的官网里找关掉它的方法,几经尝试,终于找到:

export default defineNuxtConfig({tailwindcss: {cssPath: false,},.......
})

这样打包之后就没玩意了,测试发现对项目没啥影响。
此时再运行项目,它的提示是:

No Tailwind CSS file found. Skipping...                                                                                                                                      nuxt:tailwindcss 20:25:44➜ DevTools: press Shift + Alt + D in the browser (v1.1.5)         ℹ Tailwind Viewer: http://localhost:10000/_tailwind/ 

看到是跳过了这玩意,所以nuxt3这玩意,还有很多可以琢磨的地方,50k star的成熟项目也有不成熟的地方嘛

其实我发现打包文件里还有冗余,比如图片中tailwindcss v3.4.3下面那个style,也不是我写的,我试着删掉,发现对项目也没影响,而且也是每个html文件都有。但是还不知道怎么去掉它。继续琢磨

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/830383.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

用Typescript写自动化工作流

项目地址:acao 挺早之前写过一个工具帮我构建项目并发布到指定平台,主要流程就是获取项目根目录下的配置文件,然后根据配置文件在本地通过 docker 构建一个镜像然后 push 到镜像仓库,最后通过 ssh 连接指定的服务区执行发布任务 …

Github Action Bot 开发教程

Github Action Bot 开发教程 在使用 Github 时,你可能在一些著名的开源项目,例如 Kubernetes,Istio 中看到如下的一些评论: /lgtm /retest /area bug /assign xxxx ...等等,诸如此类的一些功能性评论。在这些评论出现…

Django-基础篇

Django是一个开放源代码的Web应用框架,由Python语言编写。它遵循MVC(Model-View-Controller)的软件设计模式,使开发者能够以高效、可扩展和安全的方式构建Web应用程序。 Django具有以下特点和优势: 强大的功能&#x…

MR混合现实情景实训教学系统在军事课堂上的应用

在现代军事教育中,实践教学的重要性日益凸显。传统的军事课堂教育方式往往侧重于理论知识的传授,而忽视了实践操作的重要性。而MR混合现实情景实训教学系统的引入,为军事课堂教育带来了全新的可能性。 MR混合现实情景实训教学系统是一种结合了…

面试笔记——线程池

线程池的核心参数&#xff08;原理&#xff09; public ThreadPoolExecutor(int corePoolSize,int maximumPoolSize,long keepAliveTime,TimeUnit unit,BlockingQueue<Runnable> workQueue,ThreadFactory threadFactory,RejectedExecutionHandler handler)corePoolSize …

利用word2vec包将中文转变为词向量

代码展示&#xff1a; import jieba import re import json import logging import sys import gensim.models as word2vec from gensim.models.word2vec import LineSentence, loggerpattern u[\\s\\d,.<>/?:;\\"[\\]{}()\\|~!\t"#$%^&*\\-_a-zA-Z&…

C#创建obj三维模型文件

介绍 使用开源库创建obj三维模型文件。 开源库地址&#xff1a;https://github.com/JeremyAnsel/JeremyAnsel.Media.WavefrontObj 相关API地址&#xff1a;https://jeremyansel.github.io/JeremyAnsel.Media.WavefrontObj/api/JeremyAnsel.Media.WavefrontObj.ObjFile.html …

【docker】开放Docker端口

【docker 】 安装docker&#xff08;centOS7&#xff09;-CSDN博客 【docker】常用命令-CSDN博客 【docker】centos7配置docker镜像加速_docker仓库加速地址-CSDN博客 【docker】Hello World-CSDN博客 【docker 】Compose 使用介绍_docker compose 使用-CSDN博客 【docker…

linux(ubuntu18.04.2) Qt编译 MySQL(8.0以上版本)链接库 Qt版本 5.12.12及以上 包含Mysql动态库缺失问题

整理这篇文档的意义在于&#xff1a;自己走了很多弯路&#xff0c;淋过雨所以想为别人撑伞&#xff0c;也方便回顾&#xff0c;仅供参考 一、搭建开发环境&#xff1a; 虚拟机&#xff08;ubuntu-20.04.6-desktop-amd64&#xff09;&#xff1a;Mysql数据库 8.0.36Workbench …

tidb离线本地安装及mysql迁移到tidb

一、背景&#xff08;tidb8.0社区版&#xff09; 信创背景下不多说好吧&#xff0c;从资料上查tidb和OceanBase“兼容”&#xff08;这个词有意思&#xff09;的比较好。 其实对比了很多数据库&#xff0c;有些是提供云服务的&#xff0c;有些“不像”mysql&#xff0c;综合考虑…

智能合约语言(eDSL)—— wasmtime实现合约引擎补充

1、链上下文 由于我们是应用到区块链中&#xff0c;所以我们需要把链的环境传递给wasmtime&#xff0c;这样wasmtime在运行合约的时候&#xff0c;就可以获取到链上数据&#xff1b;我们运行合约当时的环境&#xff0c;打包成一个变量context&#xff0c;传递给wasmtime。conte…

【如何使用SSH密钥验证提升服务器安全性及操作效率】(优雅的连接到自己的linux服务器)

文章目录 一、理论基础&#xff08;不喜欢这部分的可直接看具体操作&#xff09;1.为什么要看本文&#xff08;为了zhuangbility&#xff09;2.为什么要用密钥验证&#xff08;更安全不易被攻破&#xff09;3.密码验证与密钥验证的区别 二、具体操作1.生成密钥对1.1抉择&#x…

计算机复试项目:SpringCloud实战高并发微服务架构设计

秒杀购物商城--环境搭建 秒杀购物商城基础服务组件--详细介绍 秒杀购物商城基础服务--权限中心 秒杀购物商城业务服务--收货地址 秒杀购物商城业务服务--秒杀活动服务 秒杀购物商城--购物车的功能设计及分析 秒杀购物商城基础服务-用户中心 秒杀购物商城业务服务--商品中…

Python 基于 OpenCV 视觉图像处理实战 之 OpenCV 简单人脸检测/识别实战案例 之九 简单进行嘴巴检测并添加特效的功能实现

Python 基于 OpenCV 视觉图像处理实战 之 OpenCV 简单人脸检测/识别实战案例 之九 简单进行嘴巴检测并添加特效的功能实现 目录 Python 基于 OpenCV 视觉图像处理实战 之 OpenCV 简单人脸检测/识别实战案例 之九 简单进行嘴巴检测并添加特效的功能实现 一、简单介绍 二、简单…

Visual Studio Installer 运行python 汉字

问题描述&#xff1a; Visual Studio Installer 在正常情况下运行python文件时时候&#xff0c; 不能编译中文注释&#xff0c;更不能输出中文。 解决方法&#xff1a; 在程序开头下面这一行即可。 #coding:GBK 原因及解释&#xff1a; #coding:GBK 是 Python 源文件中的一个…

ceph 1 pool(s) do not have an application enabled

查看 ceph 状态 cluster:id: 58f90b9a-155c-43cf-98af-54cb611fc8e0health: HEALTH_OKservices:mon: 3 daemons, quorum a,b,d (age 79m)ne>mgr: b(active, since 59m), standbys: ane>mds: 1/1 daemons up, 1 hot standbyne>osd: 6 osds: 6 up (since 79m), 6 in…

ArcGIS小技巧—模型构建器快速提取河网

上篇文章介绍的基于DEM的河网提取&#xff0c;需要使用多个工具&#xff0c;整体操作比较繁琐&#xff0c;在日常工作中&#xff0c;使用Arcgis提供的模型构建器可以帮助我们将多个工具整合在一起&#xff0c;在面对大量数据批量处理时&#xff0c;可以大大提高工作效率 利用模…

Python基本数据类型

描述 Python是一种高级编程语言&#xff0c;拥有丰富的数据类型用于表示不同类型的数据。基本数据类型可以分为数值型&#xff08;Numbers&#xff09;、字符串型&#xff08;Strings&#xff09;、布尔型&#xff08;Booleans&#xff09;、空值&#xff08;NoneType&#xff…

8、Flink 在 source 处生成水位线 和 在 source 之后生成水位线案例

1、AtSourceGenerateWatermark 注意&#xff1a;从 Flink 1.17开始&#xff0c;FLIP-27 源框架支持拆分级别的水印对齐。 import java.time.Duration;public class _02_AtSourceGenerateWatermark {public static void main(String[] args) throws Exception {StreamExecution…

摇杆控制电机

参考&#xff1a; 摇杆电位器控制步进电机正反转调速-Arduino中文社区 - Powered by Discuz! 一个基于树莓派和Python的无人机视觉跟踪系统_ 北漠苍狼的专栏(QQ:1746430162)-CSDN博客