Nuxt去除data-n-head等默认属性-CSDN博客
Nuxt去除data-n-head等默认属性
HolleBug
已于 2022-04-24 15:45:13 修改
阅读量2.8k
收藏
点赞数
分类专栏：
避坑笔记
文章标签：
前端
nuxt
vue.js
于 2022-04-22 15:34:49 首次发布
版权声明：本文为博主原创文章，遵循
CC 4.0 BY-SA
版权协议，转载请附上原文出处链接和本声明。
本文链接：
https://blog.csdn.net/qq_45364616/article/details/124346711
版权
专栏收录该内容
4 篇文章
0 订阅
订阅专栏
当我们使用nuxt开发网站时，生成的页面头部会自动加上 data-h-head的属性，例如
本来这也不算什么事，毕竟框架开发给标签加属性，很常见的事了
但是好巧不巧，做seo的团队发出了他们的意见，头部标签就是不能有 data-h-head属性
没得办法，作为一个高级程序员，我开始了百度，然后就搜出了以下答案
render:{
route(url, result){
result.html = result.html.replace(/data-n-head=\"ssr\"/gi, '')
（我又回来了！上面这个命令在使用npm run build 和 npm run start 部署时是没有问题的)
立马复制一看，没错解决了，本地的网页头部标签确实没有了 data-h-head
立马提交，generate打包生产，刷新一看，呐尼，这哥们还是好好的在这
左思右想，试了两次，跟代码没啥关系，生产就是没有作用
然后就去官方文档翻箱倒柜，就发现了这玩意
嗖地撕裂，当时大悟，立马把我 写在 render 里的代码，复制了过来，一顿操作，终于去除了data-h-head
hooks: {
generate:{
page(page){
page.html = page.html.replace(/data-n-head=\"ssr\"/gi, '')
}, // head 同级哦
loading: {
color: '#1393FF',
},
head: {
后来发现官方也有说解决方案
官方回答：Nuxt adds in data-n-head into this but for the most part it’s pretty standard meta tags.
generate: {
page(page) {
const cheerio = require("cheerio");
const $ = cheerio.load(page.html, { decodeEntities: false });
const attrs = [
"data-n-head-ssr",
"data-n-head",
"data-hid",
"data-vue-ssr-id",
"data-server-rendered"
];
attrs.forEach(value => {
$("*[" + value + "]").removeAttr(value);
});
page.html = $.html();
官网的确实全面一些，不过我图省事还是用上面的正则干了
今天的避坑日记就写到这里了，多谢观看，关注公众号 HolleBug 前端学习
会迷路
优惠劵
关注
点赞
觉得还不错?
一键收藏
知道了
评论
当我们使用nuxt开发网站时，生成的页面头部会自动加上 data-h-head的属性，例如本来这也不算什么事，毕竟框架开发给标签加属性，很常见的事了但是好巧不巧，做seo的团队发出了他们的意见，头部标签就是不能有 data-h-head属性没得办法，作为一个高级程序员，我开始了百度，然后就搜出了以下答案export default {
'render:route': (url, result) => {
result.html =
复制链接
扫一扫
专栏目录
参与评论
您还未登录，请先
登录
后发表或查看评论
JavaScript利用offsetTop实现楼层导航跳转
一粒程序米
07-15
319
<!DOCTYPE html>
<html lang="en">
<
head
>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
* {
单链表(结构)
weixin_52827539的博客
04-07
1201
题目描述
单链表结点的存储结构SNode包含两部分：数据、下一结点指针。单链表首个结点的地址
为表头指针,定义SNode *
=NULL表示单链表初始为空。
单链表的创建：createList(SNode *&
, int *value, int n)，用value数组中的n个数据生成一个单链表(表头指针为
)。
单链表的输出：printList(SNode *
),从头至尾遍历以
为表头的单链表，输出每个结点的数据值。
单链表数据插入: inse
【咖喱味的数据结构系列】——单链表尾插法（深入浅出从内存四区详细解读）
北豼不太皮的博客
04-01
2199
单链表尾插法一、尾部插入一个节点1.尾部插入一个节点逻辑视图2.尾部插入一个节点代码实现二、遍历单链表1.遍历单链表逻辑视图2.遍历单链表代码实现三、总体代码1.当头指针是局部变量2.当头指针是全局变量
一、尾部插入一个节点
1.尾部插入一个节点逻辑视图
2.尾部插入一个节点代码实现
二、遍历单链表
1.遍历单链表逻辑视图
2.遍历单链表代码实现
三、总体代码
1.当头指针是局部变量
#include <stdlib.h>
#include <stdio.h>
struct Nod
Linux操作系统基础指令II
HYAIWYH的博客
11-02
250
（行数lines 单词数words 字节数byte）等价于#cal
-1
直接输出当前月份日历。可以通过tail查看一个文件的动态变化。查询根目录下包含字母y的文档名称。扩展处理：统计某个目录下的文档总个数。获取之前或之后的某个时间（备份）
n.html id=198,YPE htmlhtml lang=en
data
-n-
-ssrtitle
-n-=true小程序获取不到unionid 微信开放社区...
weixin_36219842的博客
07-08
336
我们的小程序和公众号绑定在同一开放平台，隶属于同一主体，新用户在经过公众号授权登陆后，在小程序的登陆接口获取的信息只有session_key和open_id，没有unionId，请问这是什么问题我们已经在用户登陆小程序之前进行了同一平台同一主体下的公众号的授权，在小程序登陆的时候不是可以直接获取unionId吗，可是现在却与文档描述的相悖。。。我们不能调用wx.getUserInfo获取数据，这个...
meta标签
Haines
08-07
445
<meta
="true" name="viewport" content="width=1200, initial-scale=1">
项目
去除
=“ssr“
默认
属性
qq_42661587的博客
12-14
3034
修改
.config.js添加hooks配置
所有的
="ssr"
代码：
'render:route': (url, result) => {
result.html = result.html.replace(/
=\"ssr\"/gi,'')
TDk字数长度是有限制的
title 最长60个字符 30个汉字 （手机端最长18个汉字）
description 最长..
-property-decorator:
Nuxt
装饰器（基于vue-property-decorator）
05-28
装饰器
方便的ES / TypeScript装饰器，用于
中的类样式Vue组件（基于）以及（基于 ）和Vuex（基于）
该库完全依赖于 。 执照 麻省理工学院执照 安装 安装非常容易 npm i -S
-property-decorator
...
-winston-log:
模块，用于使用Winston记录SSR错误
05-01
-winston-log
向您的
应用程序添加winston / logging的模块。 该模块仅支持以通用模式运行的
应用程序。
情况下，捕获以下事件：
error级别：通过
中间件挂钩的SSR错误 info级别：
应用程序...
-vuex-localstorage
05-05
-vuex-本地存储 通过连接Vuex和Web存储，可以更有效地利用本地存储和会话存储。 与其他持久性插件不同，通过仅分配Vuex的某些特定对象，Web存储可以节省更多空间，并且还可以与现有Vuex用法一起使用。
通过本地...
-socket-io:
Socket IO-
的socket.io客户端和服务器模块
03-30
情况下启用$
Socket vuex模块和vuex中的套接字持久性使用KISS API格式支持动态API 在新的
运行时配置中支持IO配置（对于
版本> = 2.13） 自动中间件注册重要更新v1.1.14 +使用socket.io3.x。...
-svg-loader:SVG作为组件，也在服务器端！
05-13
SVG加载程序-SVG作为组件，也在服务器端！ 特征完全支持SVG作为组件。 像Vue SFC一样导入它们使用Vue绑定，就像处理普通组件一样建立在之上
2（仅
2）支持经过全面测试！演示版可以通过获得现场演示。...
JEECG表格选中状态怎么去掉
weixin_39031037的博客
04-19
579
官网代码（在取消选中状态的时候不生效）
webman 事务回滚失效问题记录
juan9872的博客
04-21
627
webman是一款基于workerman开发的高性能HTTP服务框架。webman用于替代传统的php-fpm架构，提供超高性能可扩展的HTTP服务。你可以用webman开发网站，也可以开发HTTP接口或者微服务。除此之外，webman还支持自定义进程，可以做workerman能做的任何事情，例如websocket服务、物联网、游戏、TCP服务、UDP服务、unix socket服务等等。
docker部署
项目（二）遇到的问题
最新发布
weixin_45379180的博客
04-25
248
原因： 安装docker的时候使用的是 yum -y install docker 命令，这个命令安装的是老版本。报错四：conflicts with file from package docker-common。因为使用 sudo yum install docker （下载到的是旧版）missing signature key 缺少秘钥。yum remove docker 删除docker。1、docker版本号 只有1.13.1。解决：可能是docker 未启用。
C++实战演练---负载均衡在线oj项目预热
顾得泉的博客
04-23
903
该项目是基于负载均衡的在线OJ平台，用户可以在浏览器访问各个题目，在编辑区编写代码提交，后端能够自动分配服务器资源，保持平衡的情况下为用户提供良好的编程运行环境，让代码快速运行和提交。
+ vue-i18n 踩坑记录
06-02
好的，我知道了，下面是我的回答：
首先，在使用
和vue-i18n时，需要注意以下几点：
1. 在
.config.js中配置vue-i18n：
```
module.exports = {
modules: [
'
-i18n'
],
i18n: {
locales: [
code: 'en',
file: 'en.js'
code: 'zh',
file: 'zh.js'
defaultLocale: 'en',
lazy: true,
langDir: 'lang/'
2. 在lang文件夹中添加对应的语言文件：
en.js：
export default {
hello: 'Hello'
zh.js：
hello: '你好'
3. 在组件中使用$t方法：
<template>
<div>{{ $t('hello') }}</div>
</template>
以上就是使用
和vue-i18n时需要注意的一些问题，希望对你有帮助。
“相关推荐”对你有帮助么？
非常没帮助
没帮助
一般
有帮助
非常有帮助
提交
博客等级
码龄5年
41
原创
48
173
33
粉丝
私信
热门文章
uni-app优秀的Ui模板和项目案列
21751
element-ui 表格表头禁用全选功能
17692
域名解析绑定到服务器指定端口
8260
vue eslint 报错 error Component name “about“ should always be multi-word 正确解决方案
6998
关于Mac电脑，Hbuilderx不能使用内置终端，或者内置终端npm，node命令无效的解决办法
6613
分类专栏
4篇
WEB前端
24篇
资源分享
Hbuilderx
1篇
最新评论
HolleBug:
那也确实禁用全选了啊，你可以自己把选中的存下来，再赋值回去也行啊
weixin_47094594:
第二种方法简直是疯了 当前有选中的岂不是全干掉了
哈哈，是的
美酒没故事°:
简单粗暴，哈哈哈
微信小程序文件直接上传阿里云OSS
hzf254125132:
报错，Buffer is not defined
您愿意向朋友推荐“博客详情页”吗？
强烈不推荐
不推荐
一般般
推荐
强烈推荐
最新文章
乐橙云接口请求签名计算案例
js 将摄像头录制播放成视频
js 将图片转成文件流
2023年
16篇
2022年
6篇
2021年
2020年
10篇
2019年
目录
被折叠的
条评论
为什么被折叠?
到【灌水乐园】发言
查看更多评论
添加红包
祝福语
请填写红包祝福语或标题
红包数量
红包个数最小为10个
红包总金额
红包金额最低5元
余额支付
当前余额
3.43
前往充值 >
需支付：
10.00
取消
确定
下一步
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝
规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额
抵扣说明：
1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。
余额充值