遇到Uniapp配置meta不生效怎么解决（uniapp配置文件）

一淘模板56admin.com遇到了Uniapp 是一种基于Vue.js的跨平台应用开辟框架，其开辟轻易、易上手，能够快速构建出iOS、Android以及H5页面，成为现在移动应用开辟的主要工具之一。然而，跨平台应用的开辟也带来了一些问题，比如本文即是解决uniapp页面配置 meta 不失效的问题，希望对于读者有所帮助。

问题形容

近期有开辟者反应在应用uniapp构建的H5页面中，配置meta标签不失效，即在浏览器中检察网站源代码，找不到响应的meta标签。但在开辟工具的预览中以及手机端检察页面均能够失常显示。

问题解决

一、确认meta内容是否准确

首先需要确保meta标签的内容是否准确，在uniapp的page.json中配置：

"meta": {"viewport": "width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no","keywords": "uniapp, meta, 问题, 解决","description": "uniapp 配置 meta 不失效的解决方法","apple-mobile-web-app-capable": "yes","apple-mobile-web-app-status-bar-style": "black","format-detection": "telephone=no,email=no,address=no"}

其中，viewport、keywords、description是需要的meta标签，可增添其余的meta标签停止共性化配置。

二、在index.html中增添meta标签

如果在page.json配置meta后在页面源代码中不存在响应的标签，需要在uniapp名目标index.html中将meta标签手动增添进去。比方，在head标签中增添viewport的meta标签：

如果需要增添其余的meta标签，可参考第1步中的配置。

三、确认uniapp打包配置

如果在前两步中均未能解决问题，需要确认uniapp打包的配置，主要囊括下列两个方面：

是否在uniapp的manifest.json中配置了打包的门路

manifest.json是uniapp构建的配置文件，需要在其中配置打包的门路。细致而言，需要在manifest.json中的weex>appboard>src属性或者h5>router>pages属性中增添需要打包的页面门路。

// weex > appboard > src 示例"weex": {"appName": "UniApp","appBoard": "/index.vue","pages": ["pages/tabbar/index/index","pages/tabbar/quick-work/quick-work","pages/tabbar/find/find","pages/tabbar/mine/mine"]} // h5 > router > pages 示例"h5": {"custom": {"titleNView": true,"scrollIndicator": "none"},"router": {"mode": "hash","pages": [{"path": "/","style": {"navigationBarTitleText": "首页"},"query": "","meta": {"viewport": "width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no","keywords": "uniapp, h5, 打包配置, manifest.json","description": "uniapp 配置 meta 不失效的解决方法","apple-mobile-web-app-capable": "yes","apple-mobile-web-app-status-bar-style": "black","format-detection": "telephone=no,email=no,address=no"}}]}}

是否在uniapp的vue.config.js中配置了打包的门路

除了在manifest.json中配置打包门路，也能够在uniapp名目标根目录中的vue.config.js文件中停止配置，首如果在outputDir以及pages属性中停止配置：

module.exports = {outputDir: 'dist/h5',pages: {index: {entry: 'src/main.js',template: 'public/index.html',filename: 'index.html',title: 'Index Page',chunks: ['chunk-vendors', 'chunk-co妹妹on', 'index']}}}

以上为整体示例代码，细致请查阅民间文档或者在开辟进程中停止调试。

论断

在uniapp中配置meta标签后，如果在页面源代码中不存在响应的标签，需要手动在index.html中增添；如果打包后仍未失效，需要确认manifest.json以及vue.config.js中的配置是否准确。希望本文解决了您的问题，也希望uniapp能够越来越欠缺，成为更加稳固、易用的开辟工具。

本文链接：https://addon.ciliseo.com/yu-dao-uniapp-pei-zhi-meta-bu-sheng-xiao-zen-me-jie-jue.html