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

news2024/11/25 20:55:52

全局引入外部文件方法:

在这里插入图片描述
找到根目录下的nuxt.config.ts配置文件;然后如上图所示,在defineNuxtConfig配置对象下app选项节点下,head对象中即可配置全局需要的JS或CSS文件;

// https://nuxt.com/docs/api/configuration/nuxt-config

export default defineNuxtConfig({
  devtools: { enabled: true },
  app: {
    head: {
      title: '',
      meta: [],
      link:[],
      script: [
        { src: "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js" }, {
          src:"https://api.map.baidu.com/api?v=1.0&type=webgl&ak=ZNkgnHSRut2tWZD1XC85PEdpg3UFZTbQ"
        }
      ]
    },
  },
  plugins: [
    { src: '~/plugins/jquery.js' }, 
  ],
  css: [
    '/assets/css/main.scss','/public/css/animate.css'
  ],
})

提示:本地文件注意文件路引入规则;按照文件访问规定进行访问

传送门==》Nuxt3框架局部引入外部JS/CSS

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

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

相关文章

Diagrams——制作短小精悍的流程图

今天为大家分享的是一款轻量级的流程图绘制软件——Diagrams。 以特定的图形符号加上说明,表示算法的图,称为流程图或框图。流程图是流经一个系统的信息流、观点流或部件流的图形代表。我们常用流程图来说明某一过程。 流程图使用一些标准符号代表某些类…

【Vue3 + webStorm】 求助,vite.config.js代理不生效

求助,vite.config.js代理不生效 上面为代理写法 上面为vue组件中,axios跳转写法 网页控制台一直跳转不到8080端口,请问是为什么?

标准库函数使用及源码

几个常规内存函数经常会使用的怀疑人生,现在整理一下 文章目录 前言一、pandas是什么?二、使用步骤 1.引入库2.读入数据总结 前言 以下对内存函数进行整理。 提示:以下是本篇文章正文内容,下面案例可供参考 一、资源 MSDN网址 …

深度学习YOLO抽烟行为检测 - python opencv 计算机竞赛

文章目录 1 前言1 课题背景2 实现效果3 Yolov5算法3.1 简介3.2 相关技术 4 数据集处理及实验5 部分核心代码6 最后 1 前言 🔥 优质竞赛项目系列,今天要分享的是 🚩 基于深度学习YOLO抽烟行为检测 该项目较为新颖,适合作为竞赛课…

2019年全国硕士研究生入学统一考试管理类专业学位联考数学试题——解析版

2019 年 1 月份管综初数真题 一、问题求解(本大题共 5 小题,每小题 3 分,共 45 分)下列每题给出 5 个选项中,只有一个是符合要求的,请在答题卡上将所选择的字母涂黑。 1、某车间计划 10 天完成一项任务&a…

小红书自动点赞评论脚本,可以群控多账号,按键精开源版代码分享

这个需要连接服务器,你可以在易语言配置一个服务端,然后设置好端口,脚本部署在模拟器或者云手机或者真机里面实现多账号点赞评论的效果,针对一个作品,按键精灵写的脚本,服务端的脚本需要自己写哈&#xff0…

ubuntu中/etc/rc.local和/etc/init.d/rc.local的区别是什么

在早期版本的Ubuntu中,通常会使用 /etc/rc.local 或 /etc/init.d/rc.local 文件执行在系统启动时需要运行的自定义脚本或命令。然而,随着Ubuntu的版本升级,这两者的使用方式有了一些变化。 /etc/rc.local: 功能: /etc/…

SpringBoot-配置文件properties/yml分析+tomcat最大连接数及最大并发数

SpringBoot配置文件 yaml 中的数据是有序的,properties 中的数据是无序的,在一些需要路径匹配的配置中,顺序就显得尤为重要(例如在 Spring Cloud Zuul 中的配置),此时一般采用 yaml。 Properties ①、位…

目标检测标注工具AutoDistill

引言 在快速发展的机器学习领域,有一个方面一直保持不变:繁琐和耗时的数据标注任务。无论是用于图像分类、目标检测还是语义分割,长期以来人工标记的数据集一直是监督学习的基础。 然而,由于一个创新性的工具 AutoDistill&#x…

鉴源实验室 | DoIP协议网络安全攻击

作者 | 付东杰 上海控安可信软件创新研究院工控网络安全组 来源 | 鉴源实验室 社群 | 添加微信号“TICPShanghai”加入“上海控安51fusa安全社区” 01 背 景 随着科技的迅猛发展,汽车行业正经历着前所未有的数字化变革。现代汽车中使用70多个电子控制单元&#x…

Word文档处理:用Python轻松提取Word文档图文数据

将内容从Word文档中提取出来可以方便我们对其进行其他操作,如储将内容存在数据库中、将内容导入到其他程序中、用于AI训练以及制作其他文档等。使用Spire.Doc for Python提供了一个简单的方法直接提取Word文档中的文本内容,包括文本和图片,而…

使用requests库进行网络爬虫:IP请求错误的解决方法

目录 引言 一、了解requests库 二、遇到的问题 三、解决方法 1、随机化IP地址 2、减少请求频率 3、使用User Agent模拟浏览器行为 4、使用Cookies 四、注意事项 五、使用代理池 六、总结 引言 在利用Python的requests库进行网络爬虫操作时,我们有时会遇…

js 将多张图片合并成一张图片

其实就是将两张图片地址根据canvas组合在一起,我放到项目中因为会存在跨域问题,所以将图片转化成base64,后面还会带随机值,这样可避免图片跨域错误,正常情况下可以直接将图片放到canvas里面。 灵感来源:js…

2022年蓝桥杯STEMA 计算思维组模拟练习试卷8(U10 级,约小学 3-4 年级)

1、北京冬奥会经历 17( ),中国体育代表团收获的金牌数和奖牌数均创历史新高 A、年 B、月 C、天 D、小时 答案:C 2、下面图形的周长是多少 m A、8 B、10 C、15 D、20 答案:D 3、小马虎在练习竖式计算&#xff0…

如何提升软件测试效率?本文为你揭示秘密

在软件开发中,测试是至关重要的一个环节。它能帮助我们发现并修复问题,从而确保我们提供的软件具有高质量。然而,测试过程往往费时费力。那么,有没有方法可以提升我们的软件测试效率呢?答案是肯定的。下面,…

前端uniapp列表下拉到底部加载下一页列表【下拉加载页面/带源码/实战】

目录 一. 图片1.2. 二.list.vue三.uni-load-more.vue最后 一. 图片 1. 2. 二.list.vue <template><view><!--列表--><scroll-view scroll-y"true" class"scroll-Y" :style"height: scrollviewHigh px;" lower-threshol…

怎么用领英开发客户?分享领英开发客户的方法和技巧

对于绝大多数外贸业务员来说&#xff0c;领英(LinkedIn)是一个非常重要且有效的客户开发渠道。在领英这个平台&#xff0c;如果你掌握了开发客户的方法&#xff0c;那么营销推广产品或服务的终极目标就有很大可能的实现&#xff01;其实真正上手并不难&#xff0c;因为平台内有…

07.智慧商城——商品详情页、加入购物车、拦截器封装token

01. 商品详情 - 静态布局 静态结构 和 样式 <template><div class"prodetail"><van-nav-bar fixed title"商品详情页" left-arrow click-left"$router.go(-1)" /><van-swipe :autoplay"3000" change"onCha…

Python在函数中使用列表作为默认参数

嗨喽~大家好呀&#xff0c;这里是魔王呐 ❤ ~! python更多源码/资料/解答/教程等 点击此处跳转文末名片免费获取 在学习中遇到的Python的一个坑&#xff0c;那就是使用列表作为默认参数。 我们知道&#xff0c;在Python中&#xff0c;列表&#xff08;list&#xff09;是可变…

融云五大场景化能力,全面赋能金融行业数智化转型

在高知识密度与大数据处理双向奔赴&#xff0c;「金融大模型」如何推动行业进化&#xff1f;一文中&#xff0c;我们分享了大模型在金融行业的赋能实践和未来场景。关注【融云 RongCloud】&#xff0c;了解协同办公平台更多干货。 其中&#xff0c;融云作为通信服务商&#xf…