test('should only allow single template element', () => {
parse(`<template><div/></template><template><div/></template>`)
expect(
- `Single file component can contain only one template element`
+ `Single file component can contain only one <template> element`
).toHaveBeenWarned()
})
test('should only allow single script element', () => {
parse(`<script>console.log(1)</script><script>console.log(1)</script>`)
expect(
- `Single file component can contain only one script element`
+ `Single file component can contain only one <script> element`
).toHaveBeenWarned()
})
+
+ test('should only allow single script setup element', () => {
+ parse(
+ `<script setup>console.log(1)</script><script setup>console.log(1)</script>`
+ )
+ expect(
+ `Single file component can contain only one <script setup> element`
+ ).toHaveBeenWarned()
+ })
+
+ test('should not warn script & script setup', () => {
+ parse(
+ `<script setup>console.log(1)</script><script>console.log(1)</script>`
+ )
+ expect(
+ `Single file component can contain only one`
+ ).not.toHaveBeenWarned()
+ })
})
})
export interface SFCScriptBlock extends SFCBlock {
type: 'script'
+ setup?: boolean
}
export interface SFCStyleBlock extends SFCBlock {
filename: string
template: SFCTemplateBlock | null
script: SFCScriptBlock | null
+ scriptSetup: SFCScriptBlock | null
styles: SFCStyleBlock[]
customBlocks: SFCBlock[]
}
filename,
template: null,
script: null,
+ scriptSetup: null,
styles: [],
customBlocks: []
}
}
break
case 'script':
- if (!descriptor.script) {
- descriptor.script = createBlock(node, source, pad) as SFCScriptBlock
- } else {
- warnDuplicateBlock(source, filename, node)
+ const block = createBlock(node, source, pad) as SFCScriptBlock
+ if (block.setup && !descriptor.scriptSetup) {
+ descriptor.scriptSetup = block
+ break
}
+ if (!block.setup && !descriptor.script) {
+ descriptor.script = block
+ break
+ }
+ warnDuplicateBlock(source, filename, node, block.setup)
break
case 'style':
descriptor.styles.push(createBlock(node, source, pad) as SFCStyleBlock)
function warnDuplicateBlock(
source: string,
filename: string,
- node: ElementNode
+ node: ElementNode,
+ isScriptSetup = false
) {
const codeFrame = generateCodeFrame(
source,
)
const location = `${filename}:${node.loc.start.line}:${node.loc.start.column}`
console.warn(
- `Single file component can contain only one ${
- node.tag
- } element (${location}):\n\n${codeFrame}`
+ `Single file component can contain only one <${node.tag}${
+ isScriptSetup ? ` setup` : ``
+ }> element (${location}):\n\n${codeFrame}`
)
}
}
} else if (type === 'template' && p.name === 'functional') {
;(block as SFCTemplateBlock).functional = true
+ } else if (type === 'script' && p.name === 'setup') {
+ ;(block as SFCScriptBlock).setup = true
}
}
})