Subscribe on changes!

Output an error when `<template>` nor `<script>` is included in SFC when parsing

avatar
Sep 15th 2022

What problem does this feature solve?

If you pass a string that does not include <template> or <script>, compilerSfc.parse does not output any errors.

import { parse } from '@vue/compiler-sfc';

const result = parse(`
import a from 'vue'
`);
console.log(result.errors); // []

stackblitz

According to the spec, this is a valid SFC. But this is mostly an error like passing a different value to compilerSfc.parse.

Additional context

A user was passing @vitejs/plugin-vue's output into @vitejs/plugin-vue's input. I expected compilerSfc.parse to fail the parse but in fact the input is an valid HTML, it didn't output any errors. https://github.com/vitejs/vite/issues/10133#issuecomment-1248314516 This could be fixed on Vite side but I thought it's better to have an error in vue compiler side.

What does the proposed API look like?

Change the spec slightly and add an error like:

SFC should have at least one <template> or <script>.

or

The SFC you passed only includes text nodes. It should include at least one element.