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/bicheng/6057.shtml

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

相关文章

ThinkPHP--5.0.23-rce远程代码执行

一、漏洞原理 实现框架的核心类Requests的method方法实现表单请求类伪装,默认为$_POST[‘_method’]变量,却没有对_method属性进行严格校验,可以通过变量覆盖Requests类的属性,在结合框架特性实现对任意函数的调用实现任意代码执…

Linux shell编程学习笔记48:touch命令

0 前言 touch是csdn技能树Linux基础练习题中最常见的一条命令,这次我们就来研究它的功能和用法。 1. touch命令的功能、格式和选项说明 我们可以使用命令 touch --help 来查看touch命令的帮助信息。 purpleEndurer bash ~ $ touch --help Usage: touch [OPTION]…

idm线程怎么设置 idm线程数怎么上不去 idm免安装

IDM(Internet Download Manager)是一款流行的下载管理软件,IDM采用高级的多线程下载技术,可以将下载文件分成多个部分同时下载,从而提高下载速度,它因高效的下载速度和丰富的功能而受到用户的喜爱。接下来&…

MVC和DDD的贫血和充血模型对比

文章目录 架构区别MVC三层架构DDD四层架构 贫血模型代码示例 充血模型代码示例 架构区别 MVC三层架构 MVC三层架构是软件工程中的一种设计模式,它将软件系统分为 模型(Model)、视图(View)和控制器(Contro…

一个5000刀的XSS

背景介绍 今天分享国外一个白帽小哥Crypto通过发现Apple某网站XSS而获得5000美元赏金的故事。废话不多说,让我们开始吧~ 狩猎过程 易受攻击的 Apple 服务网站是:https://discussions.apple.com,该服务是苹果用户和开发者讨论问题…

JavaScript的数据类型转换

转化为string类型: 方法说明转换对象.tostring()转换成字符串string(转换对象)转换成字符串加号拼接字符串和字符串拼接后的结果是字符串 转化为数字性: 方法说明parselnt(string&#xff…

Python 正则表达式2 语法基础

内容概述 正则表达式是由普通字符(例如"a",“b”,“c"等)以及特殊字符(例如”“,”-“,”^"等)组成的文字模式。举个例子,[a-z]这个正则表达式就代表了匹配所有的小写字母(“a”,“b”,“c”,…,…

这是一个简单网站,后续还会更新

1、首页效果图 代码 <!DOCTYPE html> <html> <head> <meta charset"utf-8" /> <title>爱德照明网站首页</title> <style> /*外部样式*/ charset "utf-8"…

什么是Vue的单文件组件(SFC)

Vue的单文件组件&#xff08;Single File Components&#xff0c;简称SFC&#xff09;是Vue.js框架中用来组织和编写组件的一种文件格式。简单来说&#xff0c;一个.vue文件就是一个单独的组件&#xff0c;它封装了组件的HTML模板、CSS样式和JavaScript逻辑。这种开发方式有助于…

Luminar开始为沃尔沃生产下一代激光雷达传感器

在自动驾驶技术的浪潮中&#xff0c;激光雷达&#xff08;LiDAR&#xff09;传感器以其高精度和强大的环境感知能力&#xff0c;逐渐成为了该领域的技术之星。Luminar&#xff08;路安达&#xff09;公司作为自动驾驶技术的领军企业&#xff0c;近日宣布已开始为沃尔沃汽车生产…

MySQL-笔记-08.数据库编程

目录 8.1 编程基础 8.1.1 基本语法 8.1.2 运算符与表达式 1. 标识符 2. 常量 &#xff08;1&#xff09; 字符串常量 &#xff08;2&#xff09;日期时间常量 &#xff08;3&#xff09;数值常量 &#xff08;4&#xff09;布尔值常量 &#xff08;5&#xff09;NULL…

牛客储物点的距离

链接&#xff1a;登录—专业IT笔试面试备考平台_牛客网 来源&#xff1a;牛客网 题目描述 一个数轴&#xff0c;每一个储物点会有一些东西&#xff0c;同时它们之间存在距离。 每次给个区间[l,r],查询把这个区间内所有储物点的东西运到另外一个储物点的代价是多少&#xff1…

如何使用免费软件从Mac恢复音频文件?

要从Mac中删除任何文件&#xff0c;背后是有原因的。大多数Mac用户都希望增加Mac中的空间&#xff0c;这就是为什么他们更喜欢从驱动器中删除文件以便出现一些空间的原因。一些Mac用户错误地删除了该文件&#xff0c;无法识别这是一个重要文件。例如&#xff0c;他们错误地从Ma…

小区服务|基于SprinBoot+vue的小区服务管理系统(源码+数据库+文档)

目录 基于SprinBootvue的小区服务管理系统 一、前言 二、系统设计 三、系统功能设计 1管理员登录 2 客服聊天管理、反馈管理管理 3 公告信息管理 4公告类型管理 四、数据库设计 五、核心代码 六、论文参考 七、最新计算机毕设选题推荐 八、源码获取&#xff1a; 博…

说一说具身人工智能

罗德尼布鲁克斯&#xff08;Rodney Brooks&#xff0c;现代机器人之父&#xff09;在 1991 年发表的研究论文《没有表征的智能》[1]提出了一种对智能的根本性重新思考。布鲁克斯反对传统的认为智能必须基于复杂算法或内部数据模型&#xff08;即“表征”&#xff09;的观点。他…

计算机网络复习-网络层

章节主要内容 虚拟互连网络 实际的计算机网络是错综复杂的物理设备通过使用ip协议&#xff0c;屏蔽了物理网络之间的差异当网络中的主机使用ip协议连接时&#xff0c;则无需关注网络细节 IP协议 ip协议使得复杂的实际网络变为一个虚拟互连的网络ip协议使得网络层可以屏蔽细…

综合案例(账号密码登录和SQL注入)

综合案例&#xff1a;账号密码登录与SQL注入 一、背景 假设我们有一个简单的用户登录页面&#xff0c;用户需要输入用户名和密码来登录系统。在后台&#xff0c;我们使用SQL查询语句来验证用户输入的用户名和密码是否与数据库中存储的相匹配。然而&#xff0c;如果我们在编写…

Debian 12 tomcat 9 catalina 日志信息 中文显示乱码

目录 问题现象 解决办法&#xff1a; 1、设定Debian locale 2、设定catalina.sh utf8字符集 问题现象 Debian 12 linux操作系统中&#xff0c;tomcat 9 catalina 启动日志输出 中文乱码 解决办法&#xff1a; 1、设定Debian locale 先确保系统本身就支持中文的 Debian …

Docker 虚拟机 WSL

WSL&#xff08;Windows Subsystem for Linux&#xff09;是Windows操作系统中的一个功能&#xff0c;它允许用户在Windows系统上运行Linux环境。它是一个兼容层&#xff0c;通过在Windows上运行一个Linux内核接口的实现来提供对Linux二进制文件的支持。 WSL提供了一个命令行界…

[CUDA 学习笔记] GEMM 优化: 双缓冲 (Prefetch) 和 Bank Conflict 解决

GEMM 优化: 双缓冲 (Prefetch) 和 Bank Conflict 解决 前言 本文主要是对 深入浅出GPU优化系列&#xff1a;GEMM优化&#xff08;一&#xff09; - 知乎, 深入浅出GPU优化系列&#xff1a;GEMM优化&#xff08;二&#xff09; - 知乎 以及 深入浅出GPU优化系列&#xff1a;GE…