若依框架Nuxt+vue3的项目，一般怎么实现ui的适配

最新推荐文章于 2024-06-13 10:52:24 发布
最新推荐文章于 2024-06-13 10:52:24 发布
阅读量269 收藏
点赞数 2
分类专栏： 提问 文章标签： 前端框架
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_46395670/article/details/136452267
版权
文章讲述了新员工在使用Nuxt框架开发官网时遇到的问题，试图通过设置页面最小宽度实现PC和移动端的适配。在本地测试正常，但在服务器上展示不一致，且手机端效果不佳。寻求解决方案。
摘要由CSDN通过智能技术生成

新人入职新公司，上一个前端写的官网，使用的若依框架Nuxt，现在要做pc端小屏幕和移动端的适配，我的想法是给每个页面都添加一个最小宽度，想让手机打开也是pc端的缩小页面，然后我电脑上正常，但是部署到服务器上后，出问题了，我自己电脑看到的和在本地运行的不一样，而且，在手机上打开，最小宽度没啥用，那我1应该怎么办

weixin_46395670
关注
  • 2
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
nuxt3适配移动端
xxx
05-22 1468
【代码】nuxt3适配移动端。
Vue3+Nuxt3实战在线教育SSR网站
03-24
Vue3+Nuxt3实战在线教育SSR网站基于Nuxt3搭建的页面
nuxt3 vue 让PC网站在手机上按比例缩小适应屏幕
weixin_55042716的博客
04-10 983
【代码】nuxt3 vue 让PC网站在刚进入网页的时候，在手机上自动按比例缩小适应屏幕。
Nuxt3+Vue3(Composition API)+TS+Vite+Ant Design Vue 搭建
woyebuzhidao321的博客
02-16 1959
最近官网搭建选择了nuxtjs，由于框架更新了，其中语法也有很多变化，中间遇到了一些问题点做下总结。
若依Ruoyi是UI框架，还是前端框架，你能分清吗？
最新发布
2401_82943878的博客
06-13 606
若依（Ruoyi）是一款基于Spring Boot和Spring Cloud的开源快速开发平台，用于快速构建企业级后台管理系统。若依提供了许多常用的功能模块和组件，包括权限管理、代码生成、工作流、消息中心等，可以帮助开发人员快速搭建企业级应用。若依具有以下特点：1.采用现代化的微服务架构，利用Spring Boot和Spring Cloud提供的便捷开发和部署特性。2.采用模块化设计，功能模块之间解耦，易于扩展和定制。3.支持多租户管理，可以为不同的租户提供独立的数据和功能。4.
vue2适配手机端
m0_65638748的博客
09-20 1538
vue2适配手机端，将px自动转为rem
rem.js
睡不够
10-09 453
(function(win,lib) { var doc = win.document; var docEl = doc.documentElement; var metaEl = doc.querySelector('meta[name="viewport"]'); var flexibleEl = doc.querySelector('meta[name="flexible"]'); var dpr = 0; var scale = 0; var tid; var flexible = lib.flex
nuxt移动端适配
weixin_30781107的博客
04-17 4077
step1：用到的工具有两个： 　　flexible.js:网上找一个，放在nuxt项目static工程下： 　　　　　　 　　postcss-pxtorem：正常npm install安装即可。 step2：安装完毕后做如下配置： 在nuxt.config.js: 这么做可以将页面引入flexible.js文件。 rootValue：37.5是以ip...
Nuxt3适配指南
weixin_44531811的博客
02-18 1213
本篇专栏基于笔者的Vue专栏，Nuxt3系列，如有不连贯之处可查看Nuxt3系列其他文章！特此说明。
关于Nuxt2适配的好办法
m0_74089229的博客
12-21 802
var tidconsole.warn('将根据已有的meta标签来设置缩放比例')if (!dpr &&!scale) {// iOS下，对于2和3的屏，用2倍的方案，其余的用1倍方案dpr = 3dpr = 2} else {dpr = 1} else {// 其他设备下，仍旧使用1倍的方案dpr = 1if (!
推荐开源项目：Nuxt UI
gitblog_00006的博客
03-23 945
推荐开源项目：Nuxt UI 项目地址:https://gitcode.com/nuxt/ui Nuxt UI 是一个由 Nuxt.js 社区开发的全面、现代且响应式的组件库，专为 Vue.js 和 Nuxt.js 应用程序设计。如果你正在寻找一款简洁、高效并且易定制的前端框架，那么 Nuxt UI 可能正是你需要的。 项目简介 Nuxt UI 提供了一系列高质量的 UI 组件，包括按钮、表单元素...
基于Nuxt3 + Vue3 + NaiveUI+ Vite实战开发在线教育SSR服务端渲染网站应用.zip
03-03
基于Nuxt3 + Vue3 + NaiveUI+ Vite实战开发在线教育SSR服务端渲染网站应用.zip 二、项目内容 项目包括：图文、音频、视频、电子书、用户、直播、问答社区、考试、拼团秒杀、优惠券模块及微信扫码支付以及（部分）...
基于Vite+Vue3+TS+Nuxt3的仿爱彼迎网站源码.zip
06-21
本项目"基于Vite+Vue3+TS+Nuxt3的仿爱彼迎网站源码"正是这样一个实践案例，它巧妙地融合了前沿的前端技术，旨在实现类似Airbnb的在线预订平台。下面，我们将深入探讨该项目中涉及的关键技术点和实现细节。 一、Vite...
Nuxt-vue3-ver:Nuxt实践中的vue3
04-23
nuxt-vue3文字 构建设置 # install dependencies $ yarn install # serve with hot reload at localhost:3000 $ yarn dev # build for production and launch server $ yarn build $ yarn start # generate static ...
项目中整合 vue + nuxt + axios + vuex + vue-router 一个基于 Nuxt 的服务器端渲染
07-13
项目介绍 项目中整合 vue + nuxt + axios + vuex + vue-router (nuxt 自带 vuex 和 vue-router)，一个基于 Nuxt 的服务器端渲染 Demo PC端项目线上地址 移动端端项目线上地址
若依UI使用手册
A121212789的博客
03-21 2091
若依框架进行后台系统设计十分快捷便利，但是前端ui上遍布若依的logo和元素肯定会让你老板/老师一眼丁真，这里介绍如何修改若依的前端ui下面提供的是修改若依ui的位置。
ElementUI快速入门
热门推荐
zp的博客
01-04 13万+
本文主要从几个方面快速入门ElementUI 1、什么是ElementUI ？ 掌握elementUI脚手架搭建 2、掌握elementUI的table组件的使用，实现列表功能 3、掌握elementUI的pagination组件的使用，实现分页功能 4、掌握elementUI的form相关组件的使用，实现条件查询功能 5、掌握elementUI的dialog组件和$message的使...
响应式web-PC端web与移动端web（H5）兼容适配 选型方案
LlanyW的专栏
08-26 5849
项目需要，公司已经有一套PC端web，需要做一套手机端浏览器可用的，但是又想兼容pc端，适配的web项目。以下是查阅到响应布局现成的开源模版。
基于nuxt+vue3+ts创建项目
09-01
基于Nuxt、Vue 3和TypeScript创建项目可以使用Nuckst框架。Nuckst框架是一个示例框架，可以帮助用户轻松使用Nuxt，并使用可能的最新模块版本对其进行管理。但需要注意的是，Nuckst框架和文档仅针对韩国的Knuckst用户进行组织和管理。因此，如果你是韩国的Knuckst用户，你可以考虑使用Nuckst框架来创建基于Nuxt、Vue 3和TypeScript的项目。<span class="em">1</span> #### 引用[.reference_title] - *1* [nuxt-template:x Nuxt模板（Typescript + Composition API）](https://download.csdn.net/download/weixin_42151373/18347551)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 100%"] [ .reference_list ]
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值