当前位置: 首页 > news >正文

Nuxt3框架局部文件引用外部JS/CSS文件的相关配置方法

引入外部JS:

<script setup>useHead({script: [ {type: "text/javascript",src: 'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js'}]})
</script>

useHead只能与组件的setup和生命周期钩子一起使用

如果需要将js放置body区域末尾,直接添加参数

<script setup>useHead({script: [ {type: "text/javascript",src: 'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js',body:true}]})
</script>

引入外部CSS:

<script setup>useHead({link: [{rel: 'preconnect',type: "text/css",href: 'https://fonts.googleapis.com'},{rel: 'stylesheet',type: "text/css",href: 'https://fonts.googleapis.com/css2?family=Roboto&display=swap',crossorigin: ''},{rel: "stylesheet",type: "text/css",href: "https://unpkg.com/swiper@8/swiper-bundle.css",},]})
</script>

扩展:

如果是本地的CSS获取JS要配置再public 的目录下,然后安装public文件目录约定访问路径进行访问即可,例如

useHead({script: [{src: "/js/jquery.js",},{src: "/js/slide.js",},],
});

相关文章:

Nuxt3框架局部文件引用外部JS/CSS文件的相关配置方法

引入外部JS&#xff1a; <script setup>useHead({script: [ {type: "text/javascript",src: https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js}]}) </script>useHead只能与组件的setup和生命周期钩子一起使用 如果需要将js放置body区…...

Docker 可视化面板 ——Portainer

Portainer 是一个非常好用的 Docker 可视化面板&#xff0c;可以让你轻松地管理你的 Docker 容器。 官网&#xff1a;Portainer: Container Management Software for Kubernetes and Docker 【Docker系列】超级好用的Docker可视化工具——Portainer_哔哩哔哩_bilibili 环境 …...

Java 教育局民办教育信息服务与监管平台

1) 项目背景 按照《中华人民共和国民办教育促进法》和《中华人民共和国政府信息公开条例》的相关规定&#xff0c;为满足学生和家长、社会各界获取权威信息的需求&#xff0c;着力解决服务老百姓最后一公里问题&#xff0c;达到宣传民办教育和引导家长择校的效果&#xff0…...

小迪笔记(1)——操作系统文件下载反弹SHELL防火墙绕过

名词解释 POC&#xff1a;验证漏洞存在的代码&#xff1b; EXP&#xff1a;利用漏洞的代码&#xff1b; payload&#xff1a;漏洞利用载荷&#xff0c; shellcode&#xff1a;漏洞代码&#xff0c; webshell&#xff1a;特指网站后门&#xff1b; 木马&#xff1a;强调控制…...

Pytorch D2L Subplots方法对画图、图片处理

问题代码 def show_images(imgs, num_rows, num_cols, titlesNone, scale1.5): #save """绘制图像列表""" figsize (num_cols * scale, num_rows * scale) _, axes d2l.plt.subplots(num_rows, num_cols, figsizefigsize) axes axes.flatten…...

MATLAB算法实战应用案例精讲-【目标检测】YOLOV5(补充篇)

目录 算法原理 YOLOv5数据集训练 软硬件背景: 数据集准备 配置文件 模型训练...

WPF中可视化树和逻辑树的区别是什么

在WPF中&#xff0c;用户界面元素被组织成树形结构。这种结构主要分为两种&#xff1a;逻辑树&#xff08;Logical Tree&#xff09;和可视化树&#xff08;Visual Tree&#xff09;。它们在设计上各有特点和用途。 逻辑树&#xff08;Logical Tree&#xff09; 逻辑树是WPF中…...

小迪安全笔记(2)——web应用架构搭建漏洞HTTP数据包代理服务器

Web应用环境架构类 开发语言&#xff1a;php、java、python、ASP、ASPX等程序源码&#xff1a;用的人多了&#xff0c;就成CMS了。中间件容器&#xff1a;IIS、Apache、Nginx、Tomcat、Weblogic、Jboos、glasshfish等数据库类型&#xff1a;Access、Mysql、Mssql、Oracle、Redi…...

[AI]ChatGPT4 与 ChatGPT3.5 区别有多大

ChatGPT 3.5 注册已经不需要手机了&#xff0c;直接邮箱认证就可以&#xff0c;这可真算是好消息&#xff0c;坏消息是 ChatGPT 4 还是要收费。 那么 GPT-3.5 与 GPT-4 区别有多大呢&#xff0c;下面简单测试一下。 以从 TDengine 订阅数据为例&#xff0c;TDengine 算是不太小…...

node实战——koa实现文件上传

文章目录 ⭐前言⭐koa实现文件上传⭐foxapi测试⭐总结⭐结束⭐前言 大家好,我是yma16,本文分享关于node实战——node实战——koa实现文件上传。 本文适用对象:前端初学者转node方向,在校大学生,即将毕业的同学,计算机爱好者。 node系列往期文章 node_windows环境变量配置…...

C++中的this指针

C中的this指针 this 实际上是成员函数的一个形参&#xff0c;在调用成员函数时将对象的地址作为实参传递给 this。不过 this 这个形参是隐式的&#xff0c;它并不出现在代码中&#xff0c;而是在编译阶段由编译器默默地将它添加到参数列表中。 this指针是类的指针&#xff0c…...

分析日志的一般套路

日志文件很多怎么快速查看&#xff1f; 整机日志一般会有统一的文件名命名规则&#xff08;如包含时间点&#xff09;&#xff0c;可以根据问题现象时间点大致定位到相应的文件根据日志文件的修改时间属性&#xff0c;定位到相应的文件根据时间点全文件夹搜索内容&#xff0c;…...

使用Flink处理Kafka中的数据_题库子任务_Java语言实现

2024年职业院校技术大赛-高职大数据应用开发赛项专题。 使用Flink处理Kafka中的数据_题库子任务1、2、3_Java语言实现使用Flink处理Kafka中的数据_题库子任务4、5、6_Java语言实现使用Flink处理Kafka中的数据_题库子任务7、8、9_Java语言实现...

k8s运维管理

node管理 node隔离与恢复 1.使用patch命令 #实现node隔离调度 kubectl patch node node1 -p {"spec":{"unschedulable":true}} #节点信息多了一项SchedulingDisabled node1 Ready,SchedulingDisabled <none> 7d3h v1.18.20 #解除 kubectl …...

【最新Tomcat】IntelliJ IDEA通用配置Tomcat教程(超详细)

前言 IntelliJ IDEA是一个强大的集成开发环境&#xff0c;能够大大简化Java应用程序的开发和部署过程。而Tomcat作为一个流行的Java Web服务器&#xff0c;其与IntelliJ IDEA的整合能够提供便捷的开发环境&#xff0c;让开发人员更专注于代码的创作与优化。 在配置IntelliJ IDE…...

安装2023最新版PyCharm来开发Python应用程序

安装2023最新版PyCharm来开发Python应用程序 Install the Latest JetBrains PyCharm Community to Develop Python Applications Python 3.12.0最新版已经由其官网python.org发布&#xff0c;这也是2023年底的最新的版本。 0. PyCharm与Python 自从1991年2月20日&#xff0…...

【c++随笔13】多态

【c随笔13】多态 多态性&#xff08;Polymorphism&#xff09;在面向对象编程中是一个重要概念&#xff0c;它允许以统一的方式处理不同类型的对象&#xff0c;并在运行时动态确定实际执行的方法或函数。一、什么是多态性&#xff1f;1、关键概念&#xff1a;C的多态性2、多态定…...

数据结构【DS】图的应用

图的连通性问题 最少边数 最多边数 无向图非连通 &#x1d48e;&#x1d7ce; &#x1d48e;&#x1d48f;−&#x1d7d0;∗(&#x1d48f;−&#x1d7cf;)/&#x1d7d0; 无向图连通 &#x1d48e;&#x1d48f;−&#x1d7cf; &#x1d48e;&#x1d48f;∗(&#…...

图像滤波处理

滤波处理是图像处理中常用的技术之一&#xff0c;用于去除图像中的噪声、平滑图像、边缘检测等。以下是几种常见的滤波处理方法&#xff1a; 1. 均值滤波 (Mean Filtering) 原理&#xff1a; 均值滤波使用一个固定大小的滤波器&#xff0c;在图像上滑动并取周围像素的平均值来…...

中间件安全:Apache 目录穿透.(CVE-2021-41773)

中间件安全&#xff1a;Apache 目录穿透.&#xff08;CVE-2021-41773&#xff09; Apache 的 2.4.49、2.4.50 版本 对路径规范化所做的更改中存在一个路径穿越漏洞&#xff0c;攻击者可利用该漏洞读取到Web目录外的其他文件&#xff0c;如系统配置文件、网站源码等&#xff0c…...

在鸿蒙HarmonyOS 5中实现抖音风格的点赞功能

下面我将详细介绍如何使用HarmonyOS SDK在HarmonyOS 5中实现类似抖音的点赞功能&#xff0c;包括动画效果、数据同步和交互优化。 1. 基础点赞功能实现 1.1 创建数据模型 // VideoModel.ets export class VideoModel {id: string "";title: string ""…...

使用分级同态加密防御梯度泄漏

抽象 联邦学习 &#xff08;FL&#xff09; 支持跨分布式客户端进行协作模型训练&#xff0c;而无需共享原始数据&#xff0c;这使其成为在互联和自动驾驶汽车 &#xff08;CAV&#xff09; 等领域保护隐私的机器学习的一种很有前途的方法。然而&#xff0c;最近的研究表明&…...

Objective-C常用命名规范总结

【OC】常用命名规范总结 文章目录 【OC】常用命名规范总结1.类名&#xff08;Class Name)2.协议名&#xff08;Protocol Name)3.方法名&#xff08;Method Name)4.属性名&#xff08;Property Name&#xff09;5.局部变量/实例变量&#xff08;Local / Instance Variables&…...

3-11单元格区域边界定位(End属性)学习笔记

返回一个Range 对象&#xff0c;只读。该对象代表包含源区域的区域上端下端左端右端的最后一个单元格。等同于按键 End 向上键(End(xlUp))、End向下键(End(xlDown))、End向左键(End(xlToLeft)End向右键(End(xlToRight)) 注意&#xff1a;它移动的位置必须是相连的有内容的单元格…...

蓝桥杯3498 01串的熵

问题描述 对于一个长度为 23333333的 01 串, 如果其信息熵为 11625907.5798&#xff0c; 且 0 出现次数比 1 少, 那么这个 01 串中 0 出现了多少次? #include<iostream> #include<cmath> using namespace std;int n 23333333;int main() {//枚举 0 出现的次数//因…...

C/C++ 中附加包含目录、附加库目录与附加依赖项详解

在 C/C 编程的编译和链接过程中&#xff0c;附加包含目录、附加库目录和附加依赖项是三个至关重要的设置&#xff0c;它们相互配合&#xff0c;确保程序能够正确引用外部资源并顺利构建。虽然在学习过程中&#xff0c;这些概念容易让人混淆&#xff0c;但深入理解它们的作用和联…...

WPF八大法则:告别模态窗口卡顿

⚙️ 核心问题&#xff1a;阻塞式模态窗口的缺陷 原始代码中ShowDialog()会阻塞UI线程&#xff0c;导致后续逻辑无法执行&#xff1a; var result modalWindow.ShowDialog(); // 线程阻塞 ProcessResult(result); // 必须等待窗口关闭根本问题&#xff1a…...

Qt的学习(一)

1.什么是Qt Qt特指用来进行桌面应用开发&#xff08;电脑上写的程序&#xff09;涉及到的一套技术Qt无法开发网页前端&#xff0c;也不能开发移动应用。 客户端开发的重要任务&#xff1a;编写和用户交互的界面。一般来说和用户交互的界面&#xff0c;有两种典型风格&…...

鸿蒙HarmonyOS 5军旗小游戏实现指南

1. 项目概述 本军旗小游戏基于鸿蒙HarmonyOS 5开发&#xff0c;采用DevEco Studio实现&#xff0c;包含完整的游戏逻辑和UI界面。 2. 项目结构 /src/main/java/com/example/militarychess/├── MainAbilitySlice.java // 主界面├── GameView.java // 游戏核…...

【免费数据】2005-2019年我国272个地级市的旅游竞争力多指标数据(33个指标)

旅游业是一个城市的重要产业构成。旅游竞争力是一个城市竞争力的重要构成部分。一个城市的旅游竞争力反映了其在旅游市场竞争中的比较优势。 今日我们分享的是2005-2019年我国272个地级市的旅游竞争力多指标数据&#xff01;该数据集源自2025年4月发表于《地理学报》的论文成果…...