分享：nuxt模板

最新推荐文章于 2025-09-18 01:50:38 发布

原创最新推荐文章于 2025-09-18 01:50:38 发布 · 753 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue #html

nuxt 同时被 2 个专栏收录

45 篇文章

订阅专栏

vue

39 篇文章

订阅专栏

本文介绍如何在Nuxt.js项目中自定义默认的HTML模板，通过在src目录下创建app.html文件，可以修改和添加特定于项目的HTML结构，例如加入针对不同浏览器版本的条件注释。

模板

你可以定制化 Nuxt.js 默认的应用模板。
定制化默认的 html 模板，只需要在src文件夹下（默认是应用根目录）创建一个 app.html 的文件。
默认模板为：

<!DOCTYPE html>
<html {{ HTML_ATTRS }}>
  <head {{ HEAD_ATTRS }}>
    {{ HEAD }}
  </head>
  <body {{ BODY_ATTRS }}>
    {{ APP }}
  </body>
</html>

举个例子，你可以修改模板添加 IE 的条件表达式：

<!DOCTYPE html>
<!--[if IE 9]><html lang="en-US" class="lt-ie9 ie9" {{ HTML_ATTRS }}><![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--><html {{ HTML_ATTRS }}><!--<![endif]-->
  <head {{ HEAD_ATTRS }}>
    {{ HEAD }}
  </head>
  <body {{ BODY_ATTRS }}>
    {{ APP }}
  </body>
</html>