nuxt.js - 如何在 Nuxt 3.x 中使用 Pug？

Question

如果我们创建 Nuxt 3 应用程序npx nuxi init nuxt3-app并更改app.vuefrom

<template>
  <div>
    <NuxtWelcome />
  </div>
</template>

至

<template lang="pug">

  div
    NuxtWelcome

</template>

我们会得到

 ERROR  [unhandledRejection] Cannot find module 'pug'                                                                                                                                                                                                      17:05:54
Require stack:
- D:\IntelliJ IDEA\Experiments\nuxt3-app\node_modules\@vue\compiler-sfc\dist\compiler-sfc.cjs.js
- D:\IntelliJ IDEA\Experiments\nuxt3-app\node_modules\vue\compiler-sfc\index.js
- D:\IntelliJ IDEA\Experiments\nuxt3-app\node_modules\@vitejs\plugin-vue\dist\index.js

我没想到内置的 Pug 支持，但也没有提示如何提供。

AFAIK 默认 Nuxt 3 设置使用 Vite 而不是 Webpack。也许答案是在 Vite 设置中覆盖？

Answer 1

对于 Vite：

1. 安装vite-plugin-pug。Vite 会自动检测到它。
2. 重新启动应用程序构建

并小心这个错误。