Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(compiler-sfc): <script> and <script setup> co-usage edge case #4419

Merged
merged 3 commits into from Aug 23, 2021
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
Expand Up @@ -33,6 +33,27 @@ return { x }
export const n = 1"
`;

exports[`SFC compile <script setup> <script> and <script setup> co-usage script setup first, lang="ts", script block content export default 1`] = `
"import { defineComponent as _defineComponent } from 'vue'
import { x } from './x'

function setup(__props, { expose }) {

x()

return { x }
}


const __default__ = {
name: \\"test\\"
}

export default _defineComponent({
...__default__,
setup})"
`;

exports[`SFC compile <script setup> <script> and <script setup> co-usage spaces in ExportDefaultDeclaration node with many spaces and newline 1`] = `
"import { x } from './x'

Expand Down
18 changes: 18 additions & 0 deletions packages/compiler-sfc/__tests__/compileScript.spec.ts
Expand Up @@ -202,6 +202,24 @@ defineExpose({ foo: 123 })
`)
assertCode(content)
})

// #4395
test('script setup first, lang="ts", script block content export default', () => {
const { content } = compile(`
<script setup lang="ts">
import { x } from './x'
x()
</script>
<script lang="ts">
export default {
name: "test"
}
</script>
`)
// ensure __default__ is declared before used
expect(content).toMatch(/const __default__[\S\s]*\.\.\.__default__/m)
assertCode(content)
})
})

describe('imports', () => {
Expand Down
30 changes: 21 additions & 9 deletions packages/compiler-sfc/src/compileScript.ts
Expand Up @@ -1150,15 +1150,27 @@ export function compileScript(
// wrap setup code with function.
// export the content of <script setup> as a named export, `setup`.
// this allows `import { setup } from '*.vue'` for testing purposes.
s.prependLeft(
startOffset,
`\nexport default ${helper(
`defineComponent`
)}({${def}${runtimeOptions}\n ${
hasAwait ? `async ` : ``
}setup(${args}) {\n${exposeCall}`
)
s.appendRight(endOffset, `})`)
if (defaultExport) {
s.prependLeft(
startOffset,
`\n${hasAwait ? `async ` : ``}function setup(${args}) {\n`
)
s.append(
`\nexport default ${helper(
`defineComponent`
)}({${def}${runtimeOptions}\n setup})`
)
} else {
s.prependLeft(
startOffset,
`\nexport default ${helper(
`defineComponent`
)}({${def}${runtimeOptions}\n ${
hasAwait ? `async ` : ``
}setup(${args}) {\n${exposeCall}`
)
s.appendRight(endOffset, `})`)
}
} else {
if (defaultExport) {
// can't rely on spread operator in non ts mode
Expand Down