在 nuxt.js 个组件文件中拆分模板、脚本和样式（HTML、JS 和 CSS）

Question

将 nuxt.js 视图、组件（和布局）拆分为单独的文件（在设计时，而不是构建后）的最佳方法是什么？对于复杂而庞大的视图和组件，当我需要在模板和脚本之间切换（查找内容等）时，我发现这非常烦人。

理想情况下，我可以定义：

- foo.vue.html
- foo.vue.js
- foo.vue.css

让 build/generate 进程完成剩下的工作。我正在使用生成的预呈现 SPA (nuxt generate)，因此如果有解决方案，则必须兼容。

Answer 1

您需要像 vue 中描述的那样手动完成 docs

<!-- my-component.vue -->
<template>
  <div>This will be pre-compiled</div>
</template>
<script src="./my-component.js"></script>
<style src="./my-component.css"></style>

在 nuxt.js 个组件文件中拆分模板、脚本和样式（HTML、JS 和 CSS）

Split template, script and styles (HTML, JS and CSS) in nuxt.js component files

vue.js

nuxt.js