diff --git a/docs/guide/ssr.md b/docs/guide/ssr.md index 2761161216d4ce..0e50dcb2358dd5 100644 --- a/docs/guide/ssr.md +++ b/docs/guide/ssr.md @@ -18,8 +18,8 @@ If you have questions, the community is usually helpful at [Vite Discord's #ssr Vite provides built-in support for server-side rendering (SSR). The Vite playground contains example SSR setups for Vue 3 and React, which can be used as references for this guide: -- [Vue 3](https://github.com/vitejs/vite/tree/main/playground/ssr-vue) -- [React](https://github.com/vitejs/vite/tree/main/playground/ssr-react) +- [Vue 3](https://github.com/vitejs/vite-plugin-vue/tree/main/playground/ssr-vue) +- [React](https://github.com/vitejs/vite-plugin-vue/tree/main/playground/ssr-react) ## Source Structure @@ -177,7 +177,7 @@ Then, in `server.js` we need to add some production specific logic by checking ` - Move the creation and all usage of the `vite` dev server behind dev-only conditional branches, then add static file serving middlewares to serve files from `dist/client`. -Refer to the [Vue](https://github.com/vitejs/vite/tree/main/playground/ssr-vue) and [React](https://github.com/vitejs/vite/tree/main/playground/ssr-react) demos for a working setup. +Refer to the [Vue](https://github.com/vitejs/vite-plugin-vue/tree/main/playground/ssr-vue) and [React](https://github.com/vitejs/vite-plugin-react/tree/main/playground/ssr-react) demos for a working setup. ## Generating Preload Directives @@ -201,11 +201,11 @@ const html = await vueServerRenderer.renderToString(app, ctx) // ctx.modules is now a Set of module IDs that were used during the render ``` -In the production branch of `server.js` we need to read and pass the manifest to the `render` function exported by `src/entry-server.js`. This would provide us with enough information to render preload directives for files used by async routes! See [demo source](https://github.com/vitejs/vite/blob/main/playground/ssr-vue/src/entry-server.js) for a full example. +In the production branch of `server.js` we need to read and pass the manifest to the `render` function exported by `src/entry-server.js`. This would provide us with enough information to render preload directives for files used by async routes! See [demo source](https://github.com/vitejs/vite-plugin-vue/blob/main/playground/ssr-vue/src/entry-server.js) for a full example. ## Pre-Rendering / SSG -If the routes and the data needed for certain routes are known ahead of time, we can pre-render these routes into static HTML using the same logic as production SSR. This can also be considered a form of Static-Site Generation (SSG). See [demo pre-render script](https://github.com/vitejs/vite/blob/main/playground/ssr-vue/prerender.js) for working example. +If the routes and the data needed for certain routes are known ahead of time, we can pre-render these routes into static HTML using the same logic as production SSR. This can also be considered a form of Static-Site Generation (SSG). See [demo pre-render script](https://github.com/vitejs/vite-plugin-vue/blob/main/playground/ssr-vue/prerender.js) for working example. ## SSR Externals diff --git a/playground/react-classic/App.jsx b/playground/react-classic/App.jsx deleted file mode 100644 index 1de7461b163776..00000000000000 --- a/playground/react-classic/App.jsx +++ /dev/null @@ -1,30 +0,0 @@ -import { useState } from 'react' - -function App() { - const [count, setCount] = useState(0) - return ( -
-
-

Hello Vite + React

-

- -

-

- Edit App.jsx and save to test HMR updates. -

- - Learn React - -
-
- ) -} - -export default App diff --git a/playground/react-classic/__tests__/react.spec.ts b/playground/react-classic/__tests__/react.spec.ts deleted file mode 100644 index 15f6319220d7f2..00000000000000 --- a/playground/react-classic/__tests__/react.spec.ts +++ /dev/null @@ -1,39 +0,0 @@ -import { expect, test } from 'vitest' -import { editFile, isServe, page, untilUpdated } from '~utils' - -test('should render', async () => { - expect(await page.textContent('h1')).toMatch('Hello Vite + React') -}) - -test('should update', async () => { - expect(await page.textContent('button')).toMatch('count is: 0') - await page.click('button') - expect(await page.textContent('button')).toMatch('count is: 1') -}) - -test('should hmr', async () => { - editFile('App.jsx', (code) => code.replace('Vite + React', 'Updated')) - await untilUpdated(() => page.textContent('h1'), 'Hello Updated') - // preserve state - expect(await page.textContent('button')).toMatch('count is: 1') -}) - -test.runIf(isServe)( - 'should have annotated jsx with file location metadata', - async () => { - const meta = await page.evaluate(() => { - const button = document.querySelector('button') - const key = Object.keys(button).find( - (key) => key.indexOf('__reactFiber') === 0 - ) - return button[key]._debugSource - }) - // If the evaluate call doesn't crash, and the returned metadata has - // the expected fields, we're good. - expect(Object.keys(meta).sort()).toEqual([ - 'columnNumber', - 'fileName', - 'lineNumber' - ]) - } -) diff --git a/playground/react-classic/index.html b/playground/react-classic/index.html deleted file mode 100644 index f0015ceb9829a3..00000000000000 --- a/playground/react-classic/index.html +++ /dev/null @@ -1,10 +0,0 @@ -
- diff --git a/playground/react-classic/package.json b/playground/react-classic/package.json deleted file mode 100644 index 2210af8d89f986..00000000000000 --- a/playground/react-classic/package.json +++ /dev/null @@ -1,23 +0,0 @@ -{ - "name": "test-react-classic", - "private": true, - "version": "0.0.0", - "scripts": { - "dev": "vite", - "build": "vite build", - "debug": "node --inspect-brk ../../packages/vite/bin/vite", - "preview": "vite preview" - }, - "dependencies": { - "react": "^18.2.0", - "react-dom": "^18.2.0" - }, - "devDependencies": { - "@vitejs/plugin-react": "^3.0.0-alpha.0" - }, - "babel": { - "presets": [ - "@babel/preset-env" - ] - } -} diff --git a/playground/react-classic/vite.config.ts b/playground/react-classic/vite.config.ts deleted file mode 100644 index a2044e99ae2f3c..00000000000000 --- a/playground/react-classic/vite.config.ts +++ /dev/null @@ -1,16 +0,0 @@ -import react from '@vitejs/plugin-react' -import type { UserConfig } from 'vite' - -const config: UserConfig = { - plugins: [ - react({ - jsxRuntime: 'classic' - }) - ], - build: { - // to make tests faster - minify: false - } -} - -export default config diff --git a/playground/react-emotion/App.jsx b/playground/react-emotion/App.jsx deleted file mode 100644 index b3715369614530..00000000000000 --- a/playground/react-emotion/App.jsx +++ /dev/null @@ -1,56 +0,0 @@ -import { useState } from 'react' -import { css } from '@emotion/react' - -import _Switch from 'react-switch' -const Switch = _Switch.default || _Switch - -export function Counter() { - const [count, setCount] = useState(0) - - return ( - - ) -} - -function FragmentTest() { - const [checked, setChecked] = useState(false) - return ( - <> - -

- -

- - ) -} - -function App() { - return ( -
-
-

Hello Vite + React + @emotion/react

- -

- Edit App.jsx and save to test HMR updates. -

- - Learn React - -
-
- ) -} - -export default App diff --git a/playground/react-emotion/__tests__/react.spec.ts b/playground/react-emotion/__tests__/react.spec.ts deleted file mode 100644 index d326a4ad0abeb8..00000000000000 --- a/playground/react-emotion/__tests__/react.spec.ts +++ /dev/null @@ -1,46 +0,0 @@ -import { expect, test } from 'vitest' -import { editFile, page, untilUpdated } from '~utils' - -test('should render', async () => { - expect(await page.textContent('h1')).toMatch( - 'Hello Vite + React + @emotion/react' - ) -}) - -test('should update', async () => { - expect(await page.textContent('button')).toMatch('count is: 0') - await page.click('button') - expect(await page.textContent('button')).toMatch('count is: 1') -}) - -test('should hmr', async () => { - editFile('App.jsx', (code) => - code.replace('Vite + React + @emotion/react', 'Updated') - ) - await untilUpdated(() => page.textContent('h1'), 'Hello Updated') - // preserve state - expect(await page.textContent('button')).toMatch('count is: 1') -}) - -test('should update button style', async () => { - function getButtonBorderStyle() { - return page.evaluate(() => { - return window.getComputedStyle(document.querySelector('button')).border - }) - } - - await page.evaluate(() => { - return document.querySelector('button').style - }) - - expect(await getButtonBorderStyle()).toMatch('2px solid rgb(0, 0, 0)') - - editFile('App.jsx', (code) => - code.replace('border: 2px solid #000', 'border: 4px solid red') - ) - - await untilUpdated(getButtonBorderStyle, '4px solid rgb(255, 0, 0)') - - // preserve state - expect(await page.textContent('button')).toMatch('count is: 1') -}) diff --git a/playground/react-emotion/index.html b/playground/react-emotion/index.html deleted file mode 100644 index f0015ceb9829a3..00000000000000 --- a/playground/react-emotion/index.html +++ /dev/null @@ -1,10 +0,0 @@ -
- diff --git a/playground/react-emotion/package.json b/playground/react-emotion/package.json deleted file mode 100644 index 1167cf3e26e7f0..00000000000000 --- a/playground/react-emotion/package.json +++ /dev/null @@ -1,27 +0,0 @@ -{ - "name": "test-react-emotion", - "private": true, - "version": "0.0.0", - "scripts": { - "dev": "vite", - "build": "vite build", - "debug": "node --inspect-brk ../../packages/vite/bin/vite", - "preview": "vite preview" - }, - "dependencies": { - "@emotion/react": "^11.10.5", - "react": "^18.2.0", - "react-dom": "^18.2.0", - "react-switch": "^7.0.0" - }, - "devDependencies": { - "@babel/plugin-proposal-pipeline-operator": "^7.18.9", - "@emotion/babel-plugin": "^11.10.5", - "@vitejs/plugin-react": "^3.0.0-alpha.0" - }, - "babel": { - "presets": [ - "@babel/preset-env" - ] - } -} diff --git a/playground/react-emotion/vite.config.ts b/playground/react-emotion/vite.config.ts deleted file mode 100644 index 197e04f870d835..00000000000000 --- a/playground/react-emotion/vite.config.ts +++ /dev/null @@ -1,18 +0,0 @@ -import react from '@vitejs/plugin-react' -import { defineConfig } from 'vite' - -export default defineConfig({ - plugins: [ - react({ - jsxImportSource: '@emotion/react', - babel: { - plugins: ['@emotion/babel-plugin'] - } - }) - ], - clearScreen: false, - build: { - // to make tests faster - minify: false - } -}) diff --git a/playground/react-env/App.jsx b/playground/react-env/App.jsx deleted file mode 100644 index 216b2989b5106f..00000000000000 --- a/playground/react-env/App.jsx +++ /dev/null @@ -1,14 +0,0 @@ -import { useState } from 'react' - -function App() { - const [count, setCount] = useState(0) - return ( -
-
-

Hello Vite + React

-
-
- ) -} - -export default App diff --git a/playground/react-env/__tests__/react.spec.ts b/playground/react-env/__tests__/react.spec.ts deleted file mode 100644 index 12686328dc816e..00000000000000 --- a/playground/react-env/__tests__/react.spec.ts +++ /dev/null @@ -1,6 +0,0 @@ -import { expect, test } from 'vitest' -import { page } from '~utils' - -test('should work', async () => { - expect(await page.textContent('h1')).toMatch('Hello Vite + React') -}) diff --git a/playground/react-env/index.html b/playground/react-env/index.html deleted file mode 100644 index f0015ceb9829a3..00000000000000 --- a/playground/react-env/index.html +++ /dev/null @@ -1,10 +0,0 @@ -
- diff --git a/playground/react-env/package.json b/playground/react-env/package.json deleted file mode 100644 index 3232076cfa0e4c..00000000000000 --- a/playground/react-env/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "test-react-env", - "private": true, - "version": "0.0.0", - "scripts": { - "dev": "vite", - "build": "vite build", - "debug": "node --inspect-brk ../../packages/vite/bin/vite", - "preview": "vite preview" - }, - "dependencies": { - "react": "^18.2.0", - "react-dom": "^18.2.0" - }, - "devDependencies": { - "@vitejs/plugin-react": "^3.0.0-alpha.0" - } -} diff --git a/playground/react-env/vite.config.ts b/playground/react-env/vite.config.ts deleted file mode 100644 index 4c1003b0e4687a..00000000000000 --- a/playground/react-env/vite.config.ts +++ /dev/null @@ -1,16 +0,0 @@ -import react from '@vitejs/plugin-react' -import type { UserConfig } from 'vite' - -// Overriding the NODE_ENV set by vitest -process.env.NODE_ENV = '' - -const config: UserConfig = { - plugins: [react()], - mode: 'staging', - build: { - // to make tests faster - minify: false - } -} - -export default config diff --git a/playground/react-sourcemap/App.jsx b/playground/react-sourcemap/App.jsx deleted file mode 100644 index ec47ca46ad212e..00000000000000 --- a/playground/react-sourcemap/App.jsx +++ /dev/null @@ -1,8 +0,0 @@ -console.log('App.jsx 1') // for sourcemap -function App() { - return
foo
-} - -console.log('App.jsx 2') // for sourcemap - -export default App diff --git a/playground/react-sourcemap/__tests__/react-sourcemap.spec.ts b/playground/react-sourcemap/__tests__/react-sourcemap.spec.ts deleted file mode 100644 index e5527ca71ea693..00000000000000 --- a/playground/react-sourcemap/__tests__/react-sourcemap.spec.ts +++ /dev/null @@ -1,8 +0,0 @@ -import { expect, test } from 'vitest' -import { isBuild, serverLogs } from '~utils' - -test.runIf(isBuild)('should not output sourcemap warning', () => { - serverLogs.forEach((log) => { - expect(log).not.toMatch('Sourcemap is likely to be incorrect') - }) -}) diff --git a/playground/react-sourcemap/index.html b/playground/react-sourcemap/index.html deleted file mode 100644 index d3ca9807c608ba..00000000000000 --- a/playground/react-sourcemap/index.html +++ /dev/null @@ -1,2 +0,0 @@ -
- diff --git a/playground/react-sourcemap/main.jsx b/playground/react-sourcemap/main.jsx deleted file mode 100644 index 705d3340097aeb..00000000000000 --- a/playground/react-sourcemap/main.jsx +++ /dev/null @@ -1,9 +0,0 @@ -import React from 'react' -import ReactDOM from 'react-dom/client' -import App from './App.jsx' - -ReactDOM.createRoot(document.getElementById('app')).render( - React.createElement(App) -) - -console.log('main.jsx') // for sourcemap diff --git a/playground/react-sourcemap/package.json b/playground/react-sourcemap/package.json deleted file mode 100644 index 7d51945d203bf0..00000000000000 --- a/playground/react-sourcemap/package.json +++ /dev/null @@ -1,20 +0,0 @@ -{ - "name": "test-react-sourcemap", - "private": true, - "version": "0.0.0", - "scripts": { - "dev": "vite", - "dev:classic": "USE_CLASSIC=1 vite", - "build": "vite build", - "build:classic": "USE_CLASSIC=1 vite build", - "debug": "node --inspect-brk ../../packages/vite/bin/vite", - "preview": "vite preview" - }, - "dependencies": { - "react": "^18.2.0", - "react-dom": "^18.2.0" - }, - "devDependencies": { - "@vitejs/plugin-react": "^3.0.0-alpha.0" - } -} diff --git a/playground/react-sourcemap/vite.config.ts b/playground/react-sourcemap/vite.config.ts deleted file mode 100644 index d8a2cc46b419b9..00000000000000 --- a/playground/react-sourcemap/vite.config.ts +++ /dev/null @@ -1,15 +0,0 @@ -import react from '@vitejs/plugin-react' -import type { UserConfig } from 'vite' - -const config: UserConfig = { - plugins: [ - react({ - jsxRuntime: process.env.USE_CLASSIC === '1' ? 'classic' : 'automatic' - }) - ], - build: { - sourcemap: true - } -} - -export default config diff --git a/playground/react/App.jsx b/playground/react/App.jsx deleted file mode 100644 index 83f4cc07ea4a07..00000000000000 --- a/playground/react/App.jsx +++ /dev/null @@ -1,53 +0,0 @@ -import { useState } from 'react' -import Button from 'jsx-entry' -import Dummy from './components/Dummy?qs-should-not-break-plugin-react' -import Parent from './hmr/parent' -import { CountProvider } from './context/CountProvider' -import { ContextButton } from './context/ContextButton' - -function App() { - const [count, setCount] = useState(0) - return ( -
-
-

Hello Vite + React

-

- -

-

- -

-

- Edit App.jsx and save to test HMR updates. -

- - Learn React - -
- - - - -
- ) -} - -function AppWithProviders() { - return ( - - - - ) -} - -export default AppWithProviders diff --git a/playground/react/__tests__/react.spec.ts b/playground/react/__tests__/react.spec.ts deleted file mode 100644 index 26eb59b5d79b7e..00000000000000 --- a/playground/react/__tests__/react.spec.ts +++ /dev/null @@ -1,96 +0,0 @@ -import { expect, test } from 'vitest' -import { - editFile, - isBuild, - isServe, - page, - untilBrowserLogAfter, - untilUpdated -} from '~utils' - -test('should render', async () => { - expect(await page.textContent('h1')).toMatch('Hello Vite + React') -}) - -test('should update', async () => { - expect(await page.textContent('#state-button')).toMatch('count is: 0') - await page.click('#state-button') - expect(await page.textContent('#state-button')).toMatch('count is: 1') -}) - -test('should hmr', async () => { - editFile('App.jsx', (code) => code.replace('Vite + React', 'Updated')) - await untilUpdated(() => page.textContent('h1'), 'Hello Updated') - // preserve state - expect(await page.textContent('#state-button')).toMatch('count is: 1') -}) - -test.runIf(isServe)( - 'should have annotated jsx with file location metadata', - async () => { - const meta = await page.evaluate(() => { - const button = document.querySelector('#state-button') - const key = Object.keys(button).find( - (key) => key.indexOf('__reactFiber') === 0 - ) - return button[key]._debugSource - }) - // If the evaluate call doesn't crash, and the returned metadata has - // the expected fields, we're good. - expect(Object.keys(meta).sort()).toEqual([ - 'columnNumber', - 'fileName', - 'lineNumber' - ]) - } -) - -if (!isBuild) { - // #9869 - test('should only hmr files with exported react components', async () => { - await untilBrowserLogAfter( - () => - editFile('hmr/no-exported-comp.jsx', (code) => - code.replace('An Object', 'Updated') - ), - [ - '[vite] invalidate /hmr/no-exported-comp.jsx', - '[vite] hot updated: /hmr/no-exported-comp.jsx', - '[vite] hot updated: /hmr/parent.jsx', - 'Parent rendered' - ], - true - ) - await untilUpdated(() => page.textContent('#parent'), 'Updated') - }) - - // #3301 - test('should hmr react context', async () => { - expect(await page.textContent('#context-button')).toMatch( - 'context-based count is: 0' - ) - await page.click('#context-button') - expect(await page.textContent('#context-button')).toMatch( - 'context-based count is: 1' - ) - - await untilBrowserLogAfter( - () => - editFile('context/CountProvider.jsx', (code) => - code.replace('context provider', 'context provider updated') - ), - [ - '[vite] invalidate /context/CountProvider.jsx', - '[vite] hot updated: /context/CountProvider.jsx', - '[vite] hot updated: /App.jsx', - '[vite] hot updated: /context/ContextButton.jsx', - 'Parent rendered' - ], - true - ) - await untilUpdated( - () => page.textContent('#context-provider'), - 'context provider updated' - ) - }) -} diff --git a/playground/react/components/Dummy.jsx b/playground/react/components/Dummy.jsx deleted file mode 100644 index 27ec3c21de30fd..00000000000000 --- a/playground/react/components/Dummy.jsx +++ /dev/null @@ -1,3 +0,0 @@ -export default function Dummy() { - return <> -} diff --git a/playground/react/context/ContextButton.jsx b/playground/react/context/ContextButton.jsx deleted file mode 100644 index 92c6d0bd26f968..00000000000000 --- a/playground/react/context/ContextButton.jsx +++ /dev/null @@ -1,11 +0,0 @@ -import { useContext } from 'react' -import { CountContext } from './CountProvider' - -export function ContextButton() { - const { count, setCount } = useContext(CountContext) - return ( - - ) -} diff --git a/playground/react/context/CountProvider.jsx b/playground/react/context/CountProvider.jsx deleted file mode 100644 index 223ad25f04f056..00000000000000 --- a/playground/react/context/CountProvider.jsx +++ /dev/null @@ -1,12 +0,0 @@ -import { createContext, useState } from 'react' -export const CountContext = createContext() - -export const CountProvider = ({ children }) => { - const [count, setCount] = useState(0) - return ( - - {children} -
context provider
- - ) -} diff --git a/playground/react/hmr/no-exported-comp.jsx b/playground/react/hmr/no-exported-comp.jsx deleted file mode 100644 index 7784bcb50603a9..00000000000000 --- a/playground/react/hmr/no-exported-comp.jsx +++ /dev/null @@ -1,7 +0,0 @@ -// This un-exported react component should not cause this file to be treated -// as an HMR boundary -const Unused = () => An unused react component - -export const Foo = { - is: 'An Object' -} diff --git a/playground/react/hmr/parent.jsx b/playground/react/hmr/parent.jsx deleted file mode 100644 index ff8698281c83c7..00000000000000 --- a/playground/react/hmr/parent.jsx +++ /dev/null @@ -1,7 +0,0 @@ -import { Foo } from './no-exported-comp' - -export default function Parent() { - console.log('Parent rendered') - - return
{Foo.is}
-} diff --git a/playground/react/index.html b/playground/react/index.html deleted file mode 100644 index f0015ceb9829a3..00000000000000 --- a/playground/react/index.html +++ /dev/null @@ -1,10 +0,0 @@ -
- diff --git a/playground/react/jsx-entry/Button.jsx b/playground/react/jsx-entry/Button.jsx deleted file mode 100644 index 4f7f2b91a7dd8b..00000000000000 --- a/playground/react/jsx-entry/Button.jsx +++ /dev/null @@ -1,5 +0,0 @@ -const Button = ({ children }) => { - return -} - -export default Button diff --git a/playground/react/jsx-entry/package.json b/playground/react/jsx-entry/package.json deleted file mode 100644 index 4bfa33570ce162..00000000000000 --- a/playground/react/jsx-entry/package.json +++ /dev/null @@ -1,6 +0,0 @@ -{ - "name": "jsx-entry", - "private": true, - "version": "0.0.0", - "main": "Button.jsx" -} diff --git a/playground/react/package.json b/playground/react/package.json deleted file mode 100644 index e9a9f242a46248..00000000000000 --- a/playground/react/package.json +++ /dev/null @@ -1,24 +0,0 @@ -{ - "name": "test-react", - "private": true, - "version": "0.0.0", - "scripts": { - "dev": "vite", - "build": "vite build", - "debug": "node --inspect-brk ../../packages/vite/bin/vite", - "preview": "vite preview" - }, - "dependencies": { - "jsx-entry": "file:./jsx-entry", - "react": "^18.2.0", - "react-dom": "^18.2.0" - }, - "devDependencies": { - "@vitejs/plugin-react": "^3.0.0-alpha.0" - }, - "babel": { - "presets": [ - "@babel/preset-env" - ] - } -} diff --git a/playground/react/vite.config.ts b/playground/react/vite.config.ts deleted file mode 100644 index cd4aaee2d3432c..00000000000000 --- a/playground/react/vite.config.ts +++ /dev/null @@ -1,13 +0,0 @@ -import react from '@vitejs/plugin-react' -import type { UserConfig } from 'vite' - -const config: UserConfig = { - mode: 'development', - plugins: [react()], - build: { - // to make tests faster - minify: false - } -} - -export default config diff --git a/playground/ssr-react/__tests__/serve.ts b/playground/ssr-react/__tests__/serve.ts deleted file mode 100644 index df23d4f0661c4c..00000000000000 --- a/playground/ssr-react/__tests__/serve.ts +++ /dev/null @@ -1,70 +0,0 @@ -// this is automatically detected by playground/vitestSetup.ts and will replace -// the default e2e test serve behavior - -import path from 'node:path' -import kill from 'kill-port' -import { hmrPorts, isBuild, ports, rootDir } from '~utils' - -export const port = ports['ssr-react'] - -export async function serve(): Promise<{ close(): Promise }> { - if (isBuild) { - // build first - const { build } = await import('vite') - // client build - await build({ - root: rootDir, - logLevel: 'silent', // exceptions are logged by Vitest - build: { - target: 'esnext', - minify: false, - ssrManifest: true, - outDir: 'dist/client' - } - }) - // server build - await build({ - root: rootDir, - logLevel: 'silent', - build: { - target: 'esnext', - ssr: 'src/entry-server.jsx', - outDir: 'dist/server', - rollupOptions: { - output: { - entryFileNames: 'entry-server.js' - } - } - } - }) - } - - await kill(port) - - const { createServer } = await import(path.resolve(rootDir, 'server.js')) - const { app, vite } = await createServer( - rootDir, - isBuild, - hmrPorts['ssr-react'] - ) - - return new Promise((resolve, reject) => { - try { - const server = app.listen(port, () => { - resolve({ - // for test teardown - async close() { - await new Promise((resolve) => { - server.close(resolve) - }) - if (vite) { - await vite.close() - } - } - }) - }) - } catch (e) { - reject(e) - } - }) -} diff --git a/playground/ssr-react/__tests__/ssr-react.spec.ts b/playground/ssr-react/__tests__/ssr-react.spec.ts deleted file mode 100644 index 111a52aa5537ae..00000000000000 --- a/playground/ssr-react/__tests__/ssr-react.spec.ts +++ /dev/null @@ -1,77 +0,0 @@ -import fetch from 'node-fetch' -import { expect, test } from 'vitest' -import { port } from './serve' -import { - browserLogs, - editFile, - page, - untilBrowserLogAfter, - untilUpdated -} from '~utils' - -const url = `http://localhost:${port}` - -test('/env', async () => { - await untilBrowserLogAfter(() => page.goto(url + '/env'), 'hydrated') - - expect(await page.textContent('h1')).toMatch('default message here') - - // raw http request - const envHtml = await (await fetch(url + '/env')).text() - expect(envHtml).toMatch('API_KEY_qwertyuiop') -}) - -test('/about', async () => { - await untilBrowserLogAfter(() => page.goto(url + '/about'), 'hydrated') - - expect(await page.textContent('h1')).toMatch('About') - // should not have hydration mismatch - browserLogs.forEach((msg) => { - expect(msg).not.toMatch('Expected server HTML') - }) - - // raw http request - const aboutHtml = await (await fetch(url + '/about')).text() - expect(aboutHtml).toMatch('About') -}) - -test('/', async () => { - await untilBrowserLogAfter(() => page.goto(url), 'hydrated') - - expect(await page.textContent('h1')).toMatch('Home') - // should not have hydration mismatch - browserLogs.forEach((msg) => { - expect(msg).not.toMatch('Expected server HTML') - }) - - // raw http request - const html = await (await fetch(url)).text() - expect(html).toMatch('Home') -}) - -test('hmr', async () => { - await page.goto(url) - editFile('src/pages/Home.jsx', (code) => - code.replace('

Home', '

changed') - ) - await untilUpdated(() => page.textContent('h1'), 'changed') -}) - -test('client navigation', async () => { - await untilBrowserLogAfter(() => page.goto(url), 'hydrated') - - await untilUpdated(() => page.textContent('a[href="/about"]'), 'About') - await page.click('a[href="/about"]') - await untilUpdated(() => page.textContent('h1'), 'About') - editFile('src/pages/About.jsx', (code) => - code.replace('

About', '

changed') - ) - await untilUpdated(() => page.textContent('h1'), 'changed') -}) - -test(`circular dependencies modules doesn't throw`, async () => { - await page.goto(url) - expect(await page.textContent('.circ-dep-init')).toMatch( - 'circ-dep-init-a circ-dep-init-b' - ) -}) diff --git a/playground/ssr-react/index.html b/playground/ssr-react/index.html deleted file mode 100644 index 1c891c04355068..00000000000000 --- a/playground/ssr-react/index.html +++ /dev/null @@ -1,12 +0,0 @@ - - - - - - Vite App - - -
- - - diff --git a/playground/ssr-react/package.json b/playground/ssr-react/package.json deleted file mode 100644 index f9419fcc53b731..00000000000000 --- a/playground/ssr-react/package.json +++ /dev/null @@ -1,26 +0,0 @@ -{ - "name": "test-ssr-react", - "private": true, - "version": "0.0.0", - "type": "module", - "scripts": { - "dev": "node server", - "build": "npm run build:client && npm run build:server", - "build:client": "vite build --outDir dist/client", - "build:server": "vite build --ssr src/entry-server.jsx --outDir dist/server", - "generate": "vite build --outDir dist/static && npm run build:server && node prerender", - "serve": "NODE_ENV=production node server", - "debug": "node --inspect-brk server" - }, - "dependencies": { - "react": "^18.2.0", - "react-dom": "^18.2.0", - "react-router-dom": "^6.4.3" - }, - "devDependencies": { - "@vitejs/plugin-react": "^3.0.0-alpha.0", - "compression": "^1.7.4", - "express": "^4.18.2", - "serve-static": "^1.15.0" - } -} diff --git a/playground/ssr-react/prerender.js b/playground/ssr-react/prerender.js deleted file mode 100644 index 8a18a492ab138c..00000000000000 --- a/playground/ssr-react/prerender.js +++ /dev/null @@ -1,34 +0,0 @@ -// Pre-render the app into static HTML. -// run `yarn generate` and then `dist/static` can be served as a static site. - -import fs from 'node:fs' -import path from 'node:path' -import { fileURLToPath } from 'node:url' - -const __dirname = path.dirname(fileURLToPath(import.meta.url)) -const toAbsolute = (p) => path.resolve(__dirname, p) - -const template = fs.readFileSync(toAbsolute('dist/static/index.html'), 'utf-8') -const { render } = await import('./dist/server/entry-server.js') - -// determine routes to pre-render from src/pages -const routesToPrerender = fs - .readdirSync(toAbsolute('src/pages')) - .map((file) => { - const name = file.replace(/\.jsx$/, '').toLowerCase() - return name === 'home' ? `/` : `/${name}` - }) - -;(async () => { - // pre-render each route... - for (const url of routesToPrerender) { - const context = {} - const appHtml = await render(url, context) - - const html = template.replace(``, appHtml) - - const filePath = `dist/static${url === '/' ? '/index' : url}.html` - fs.writeFileSync(toAbsolute(filePath), html) - console.log('pre-rendered:', filePath) - } -})() diff --git a/playground/ssr-react/server.js b/playground/ssr-react/server.js deleted file mode 100644 index 2f878092c8eb1b..00000000000000 --- a/playground/ssr-react/server.js +++ /dev/null @@ -1,103 +0,0 @@ -import fs from 'node:fs' -import path from 'node:path' -import { fileURLToPath } from 'node:url' -import express from 'express' - -const __dirname = path.dirname(fileURLToPath(import.meta.url)) - -const isTest = process.env.VITEST - -process.env.MY_CUSTOM_SECRET = 'API_KEY_qwertyuiop' - -export async function createServer( - root = process.cwd(), - isProd = process.env.NODE_ENV === 'production', - hmrPort -) { - const resolve = (p) => path.resolve(__dirname, p) - - const indexProd = isProd - ? fs.readFileSync(resolve('dist/client/index.html'), 'utf-8') - : '' - - const app = express() - - /** - * @type {import('vite').ViteDevServer} - */ - let vite - if (!isProd) { - vite = await ( - await import('vite') - ).createServer({ - root, - logLevel: isTest ? 'error' : 'info', - server: { - middlewareMode: true, - watch: { - // During tests we edit the files too fast and sometimes chokidar - // misses change events, so enforce polling for consistency - usePolling: true, - interval: 100 - }, - hmr: { - port: hmrPort - } - }, - appType: 'custom' - }) - // use vite's connect instance as middleware - app.use(vite.middlewares) - } else { - app.use((await import('compression')).default()) - app.use( - (await import('serve-static')).default(resolve('dist/client'), { - index: false - }) - ) - } - - app.use('*', async (req, res) => { - try { - const url = req.originalUrl - - let template, render - if (!isProd) { - // always read fresh template in dev - template = fs.readFileSync(resolve('index.html'), 'utf-8') - template = await vite.transformIndexHtml(url, template) - render = (await vite.ssrLoadModule('/src/entry-server.jsx')).render - } else { - template = indexProd - // @ts-ignore - render = (await import('./dist/server/entry-server.js')).render - } - - const context = {} - const appHtml = render(url, context) - - if (context.url) { - // Somewhere a `` was rendered - return res.redirect(301, context.url) - } - - const html = template.replace(``, appHtml) - - res.status(200).set({ 'Content-Type': 'text/html' }).end(html) - } catch (e) { - !isProd && vite.ssrFixStacktrace(e) - console.log(e.stack) - res.status(500).end(e.stack) - } - }) - - return { app, vite } -} - -if (!isTest) { - createServer().then(({ app }) => - app.listen(5173, () => { - console.log('http://localhost:5173') - }) - ) -} diff --git a/playground/ssr-react/src/App.jsx b/playground/ssr-react/src/App.jsx deleted file mode 100644 index 6be6af9a8fb0ab..00000000000000 --- a/playground/ssr-react/src/App.jsx +++ /dev/null @@ -1,37 +0,0 @@ -import { Link, Route, Routes } from 'react-router-dom' - -// Auto generates routes from files under ./pages -// https://vitejs.dev/guide/features.html#glob-import -const pages = import.meta.glob('./pages/*.jsx', { eager: true }) - -const routes = Object.keys(pages).map((path) => { - const name = path.match(/\.\/pages\/(.*)\.jsx$/)[1] - return { - name, - path: name === 'Home' ? '/' : `/${name.toLowerCase()}`, - component: pages[path].default - } -}) - -export function App() { - return ( - <> - - - {routes.map(({ path, component: RouteComp }) => { - return }> - })} - - - ) -} diff --git a/playground/ssr-react/src/add.js b/playground/ssr-react/src/add.js deleted file mode 100644 index a0e419e9cfcacf..00000000000000 --- a/playground/ssr-react/src/add.js +++ /dev/null @@ -1,9 +0,0 @@ -import { multiply } from './multiply' - -export function add(a, b) { - return a + b -} - -export function addAndMultiply(a, b, c) { - return multiply(add(a, b), c) -} diff --git a/playground/ssr-react/src/circular-dep-init/README.md b/playground/ssr-react/src/circular-dep-init/README.md deleted file mode 100644 index 864d16ae8c495b..00000000000000 --- a/playground/ssr-react/src/circular-dep-init/README.md +++ /dev/null @@ -1 +0,0 @@ -This test aim to find out wherever the modules with circular dependencies are correctly initialized diff --git a/playground/ssr-react/src/circular-dep-init/circular-dep-init.js b/playground/ssr-react/src/circular-dep-init/circular-dep-init.js deleted file mode 100644 index 8867d64ec45091..00000000000000 --- a/playground/ssr-react/src/circular-dep-init/circular-dep-init.js +++ /dev/null @@ -1,2 +0,0 @@ -export * from './module-a' -export { getValueAB } from './module-b' diff --git a/playground/ssr-react/src/circular-dep-init/module-a.js b/playground/ssr-react/src/circular-dep-init/module-a.js deleted file mode 100644 index 335b3ac26ab3b5..00000000000000 --- a/playground/ssr-react/src/circular-dep-init/module-a.js +++ /dev/null @@ -1 +0,0 @@ -export const valueA = 'circ-dep-init-a' diff --git a/playground/ssr-react/src/circular-dep-init/module-b.js b/playground/ssr-react/src/circular-dep-init/module-b.js deleted file mode 100644 index cb16d7e9be4a30..00000000000000 --- a/playground/ssr-react/src/circular-dep-init/module-b.js +++ /dev/null @@ -1,8 +0,0 @@ -import { valueA } from './circular-dep-init' - -export const valueB = 'circ-dep-init-b' -export const valueAB = valueA.concat(` ${valueB}`) - -export function getValueAB() { - return valueAB -} diff --git a/playground/ssr-react/src/entry-client.jsx b/playground/ssr-react/src/entry-client.jsx deleted file mode 100644 index 703199443d9cca..00000000000000 --- a/playground/ssr-react/src/entry-client.jsx +++ /dev/null @@ -1,11 +0,0 @@ -import ReactDOM from 'react-dom/client' -import { BrowserRouter } from 'react-router-dom' -import { App } from './App' - -ReactDOM.hydrateRoot( - document.getElementById('app'), - - - -) -console.log('hydrated') diff --git a/playground/ssr-react/src/entry-server.jsx b/playground/ssr-react/src/entry-server.jsx deleted file mode 100644 index ea1b86aebd4716..00000000000000 --- a/playground/ssr-react/src/entry-server.jsx +++ /dev/null @@ -1,11 +0,0 @@ -import ReactDOMServer from 'react-dom/server' -import { StaticRouter } from 'react-router-dom/server' -import { App } from './App' - -export function render(url, context) { - return ReactDOMServer.renderToString( - - - - ) -} diff --git a/playground/ssr-react/src/forked-deadlock/README.md b/playground/ssr-react/src/forked-deadlock/README.md deleted file mode 100644 index 798c8c429ee9e4..00000000000000 --- a/playground/ssr-react/src/forked-deadlock/README.md +++ /dev/null @@ -1,51 +0,0 @@ -This test aim to check for a particular type of circular dependency that causes tricky deadlocks, **deadlocks with forked imports stack** - -``` -A -> B means: B is imported by A and B has A in its stack -A ... B means: A is waiting for B to ssrLoadModule() - -H -> X ... Y -H -> X -> Y ... B -H -> A ... B -H -> A -> B ... X -``` - -### Forked deadlock description: - -``` -[X] is waiting for [Y] to resolve - ↑ ↳ is waiting for [A] to resolve - │ ↳ is waiting for [B] to resolve - │ ↳ is waiting for [X] to resolve - └────────────────────────────────────────────────────────────────────────┘ -``` - -This may seems a traditional deadlock, but the thing that makes this special is the import stack of each module: - -``` -[X] stack: - [H] -``` - -``` -[Y] stack: - [X] - [H] -``` - -``` -[A] stack: - [H] -``` - -``` -[B] stack: - [A] - [H] -``` - -Even if `[X]` is imported by `[B]`, `[B]` is not in `[X]`'s stack because it's imported by `[H]` in first place then it's stack is only composed by `[H]`. `[H]` **forks** the imports **stack** and this make hard to be found. - -### Fix description - -Vite, when imports `[X]`, should check whether `[X]` is already pending and if it is, it must check that, when it was imported in first place, the stack of `[X]` doesn't have any module in common with the current module; in this case `[B]` has the module `[H]` is common with `[X]` and i can assume that a deadlock is going to happen. diff --git a/playground/ssr-react/src/forked-deadlock/common-module.js b/playground/ssr-react/src/forked-deadlock/common-module.js deleted file mode 100644 index c73a3ee4b970c8..00000000000000 --- a/playground/ssr-react/src/forked-deadlock/common-module.js +++ /dev/null @@ -1,10 +0,0 @@ -import { stuckModuleExport } from './stuck-module' -import { deadlockfuseModuleExport } from './deadlock-fuse-module' - -/** - * module H - */ -export function commonModuleExport() { - stuckModuleExport() - deadlockfuseModuleExport() -} diff --git a/playground/ssr-react/src/forked-deadlock/deadlock-fuse-module.js b/playground/ssr-react/src/forked-deadlock/deadlock-fuse-module.js deleted file mode 100644 index 4f31763ba2343f..00000000000000 --- a/playground/ssr-react/src/forked-deadlock/deadlock-fuse-module.js +++ /dev/null @@ -1,8 +0,0 @@ -import { fuseStuckBridgeModuleExport } from './fuse-stuck-bridge-module' - -/** - * module A - */ -export function deadlockfuseModuleExport() { - fuseStuckBridgeModuleExport() -} diff --git a/playground/ssr-react/src/forked-deadlock/fuse-stuck-bridge-module.js b/playground/ssr-react/src/forked-deadlock/fuse-stuck-bridge-module.js deleted file mode 100644 index 211ad7c3bc9f92..00000000000000 --- a/playground/ssr-react/src/forked-deadlock/fuse-stuck-bridge-module.js +++ /dev/null @@ -1,8 +0,0 @@ -import { stuckModuleExport } from './stuck-module' - -/** - * module C - */ -export function fuseStuckBridgeModuleExport() { - stuckModuleExport() -} diff --git a/playground/ssr-react/src/forked-deadlock/middle-module.js b/playground/ssr-react/src/forked-deadlock/middle-module.js deleted file mode 100644 index 0632eedeabd7a5..00000000000000 --- a/playground/ssr-react/src/forked-deadlock/middle-module.js +++ /dev/null @@ -1,8 +0,0 @@ -import { deadlockfuseModuleExport } from './deadlock-fuse-module' - -/** - * module Y - */ -export function middleModuleExport() { - void deadlockfuseModuleExport -} diff --git a/playground/ssr-react/src/forked-deadlock/stuck-module.js b/playground/ssr-react/src/forked-deadlock/stuck-module.js deleted file mode 100644 index 50b4d28063dc70..00000000000000 --- a/playground/ssr-react/src/forked-deadlock/stuck-module.js +++ /dev/null @@ -1,8 +0,0 @@ -import { middleModuleExport } from './middle-module' - -/** - * module X - */ -export function stuckModuleExport() { - middleModuleExport() -} diff --git a/playground/ssr-react/src/multiply.js b/playground/ssr-react/src/multiply.js deleted file mode 100644 index 94f43efbff58bd..00000000000000 --- a/playground/ssr-react/src/multiply.js +++ /dev/null @@ -1,9 +0,0 @@ -import { add } from './add' - -export function multiply(a, b) { - return a * b -} - -export function multiplyAndAdd(a, b, c) { - return add(multiply(a, b), c) -} diff --git a/playground/ssr-react/src/pages/About.jsx b/playground/ssr-react/src/pages/About.jsx deleted file mode 100644 index 0fe4de69078504..00000000000000 --- a/playground/ssr-react/src/pages/About.jsx +++ /dev/null @@ -1,12 +0,0 @@ -import { addAndMultiply } from '../add' -import { multiplyAndAdd } from '../multiply' - -export default function About() { - return ( - <> -

About

-
{addAndMultiply(1, 2, 3)}
-
{multiplyAndAdd(1, 2, 3)}
- - ) -} diff --git a/playground/ssr-react/src/pages/Env.jsx b/playground/ssr-react/src/pages/Env.jsx deleted file mode 100644 index 1102990f11c8cb..00000000000000 --- a/playground/ssr-react/src/pages/Env.jsx +++ /dev/null @@ -1,7 +0,0 @@ -export default function Env() { - let msg = 'default message here' - try { - msg = process.env.MY_CUSTOM_SECRET || msg - } catch {} - return

{msg}

-} diff --git a/playground/ssr-react/src/pages/Home.jsx b/playground/ssr-react/src/pages/Home.jsx deleted file mode 100644 index d1f4944810cc98..00000000000000 --- a/playground/ssr-react/src/pages/Home.jsx +++ /dev/null @@ -1,17 +0,0 @@ -import { addAndMultiply } from '../add' -import { multiplyAndAdd } from '../multiply' -import { commonModuleExport } from '../forked-deadlock/common-module' -import { getValueAB } from '../circular-dep-init/circular-dep-init' - -export default function Home() { - commonModuleExport() - - return ( - <> -

Home

-
{addAndMultiply(1, 2, 3)}
-
{multiplyAndAdd(1, 2, 3)}
-
{getValueAB()}
- - ) -} diff --git a/playground/ssr-react/vite.config.js b/playground/ssr-react/vite.config.js deleted file mode 100644 index 676c52ac687f59..00000000000000 --- a/playground/ssr-react/vite.config.js +++ /dev/null @@ -1,9 +0,0 @@ -import { defineConfig } from 'vite' -import react from '@vitejs/plugin-react' - -export default defineConfig({ - plugins: [react()], - build: { - minify: false - } -}) diff --git a/playground/ssr-vue/__tests__/fixtures/ssrModuleLoader-bad.js b/playground/ssr-vue/__tests__/fixtures/ssrModuleLoader-bad.js deleted file mode 100644 index a51a0519d34003..00000000000000 --- a/playground/ssr-vue/__tests__/fixtures/ssrModuleLoader-bad.js +++ /dev/null @@ -1,2 +0,0 @@ -export const bad = 1 -throw new Error('it is an expected error') diff --git a/playground/ssr-vue/__tests__/serve.ts b/playground/ssr-vue/__tests__/serve.ts deleted file mode 100644 index e03810017bc04e..00000000000000 --- a/playground/ssr-vue/__tests__/serve.ts +++ /dev/null @@ -1,71 +0,0 @@ -// this is automatically detected by playground/vitestSetup.ts and will replace -// the default e2e test serve behavior - -import path from 'node:path' -import kill from 'kill-port' -import type { ViteDevServer } from 'vite' -import { hmrPorts, isBuild, ports, rootDir } from '~utils' - -export const port = ports['ssr-vue'] - -export let viteServer: ViteDevServer - -export async function serve(): Promise<{ close(): Promise }> { - if (isBuild) { - // build first - const { build } = await import('vite') - // client build - await build({ - base: '/test/', - root: rootDir, - logLevel: 'silent', // exceptions are logged by Vitest - build: { - target: 'esnext', - minify: false, - ssrManifest: true, - outDir: 'dist/client' - } - }) - // server build - await build({ - base: '/test/', - root: rootDir, - logLevel: 'silent', - build: { - target: 'esnext', - ssr: 'src/entry-server.js', - outDir: 'dist/server' - } - }) - } - - await kill(port) - - const { createServer } = await import(path.resolve(rootDir, 'server.js')) - const { app, vite } = await createServer( - rootDir, - isBuild, - hmrPorts['ssr-vue'] - ) - viteServer = vite - - return new Promise((resolve, reject) => { - try { - const server = app.listen(port, () => { - resolve({ - // for test teardown - async close() { - await new Promise((resolve) => { - server.close(resolve) - }) - if (vite) { - await vite.close() - } - } - }) - }) - } catch (e) { - reject(e) - } - }) -} diff --git a/playground/ssr-vue/__tests__/ssr-vue.spec.ts b/playground/ssr-vue/__tests__/ssr-vue.spec.ts deleted file mode 100644 index 19f684e2ca48d0..00000000000000 --- a/playground/ssr-vue/__tests__/ssr-vue.spec.ts +++ /dev/null @@ -1,247 +0,0 @@ -import { resolve } from 'node:path' -import { fileURLToPath } from 'node:url' -import fetch from 'node-fetch' -import { expect, test, vi } from 'vitest' -import { port } from './serve' -import { - browserLogs, - editFile, - getColor, - isBuild, - page, - untilBrowserLogAfter, - untilUpdated, - viteServer -} from '~utils' - -const url = `http://localhost:${port}/test/` - -test('vuex can be import succeed by named import', async () => { - // wait networkidle for dynamic optimize vuex - await page.goto(url + 'store', { waitUntil: 'networkidle' }) - expect(await page.textContent('h1')).toMatch('bar') - - // raw http request - const storeHtml = await (await fetch(url + 'store')).text() - expect(storeHtml).toMatch('bar') -}) - -test('/about', async () => { - await untilBrowserLogAfter(() => page.goto(url + 'about'), 'hydrated') - - expect(await page.textContent('h1')).toMatch('About') - // should not have hydration mismatch - browserLogs.forEach((msg) => { - expect(msg).not.toMatch('mismatch') - }) - - // fetch sub route - const aboutHtml = await (await fetch(url + 'about')).text() - expect(aboutHtml).toMatch('About') - if (isBuild) { - // assert correct preload directive generation for async chunks and CSS - expect(aboutHtml).not.toMatch( - /link rel="modulepreload".*?href="\/test\/assets\/Home-\w{8}\.js"/ - ) - expect(aboutHtml).not.toMatch( - /link rel="stylesheet".*?href="\/test\/assets\/Home-\w{8}\.css"/ - ) - expect(aboutHtml).toMatch( - /link rel="modulepreload".*?href="\/test\/assets\/About-\w{8}\.js"/ - ) - expect(aboutHtml).toMatch( - /link rel="stylesheet".*?href="\/test\/assets\/About-\w{8}\.css"/ - ) - } -}) - -test('/external', async () => { - await untilBrowserLogAfter(() => page.goto(url + 'external'), 'hydrated') - - expect(await page.textContent('div')).toMatch( - 'Example external component content' - ) - // should not have hydration mismatch - browserLogs.forEach((msg) => { - expect(msg).not.toMatch('mismatch') - }) - - // fetch sub route - const externalHtml = await (await fetch(url + 'external')).text() - expect(externalHtml).toMatch('Example external component content') - if (isBuild) { - // assert correct preload directive generation for async chunks and CSS - expect(externalHtml).not.toMatch( - /link rel="modulepreload".*?href="\/test\/assets\/Home-\w{8}\.js"/ - ) - expect(externalHtml).not.toMatch( - /link rel="stylesheet".*?href="\/test\/assets\/Home-\w{8}\.css"/ - ) - expect(externalHtml).toMatch( - /link rel="modulepreload".*?href="\/test\/assets\/External-\w{8}\.js"/ - ) - } -}) - -test('/', async () => { - await untilBrowserLogAfter(() => page.goto(url), 'hydrated') - - expect(await page.textContent('h1')).toMatch('Home') - // should not have hydration mismatch - browserLogs.forEach((msg) => { - expect(msg).not.toMatch('mismatch') - }) - - const html = await (await fetch(url)).text() - expect(html).toMatch('Home') - if (isBuild) { - // assert correct preload directive generation for async chunks and CSS - expect(html).toMatch( - /link rel="modulepreload".*?href="\/test\/assets\/Home-\w{8}\.js"/ - ) - expect(html).toMatch( - /link rel="stylesheet".*?href="\/test\/assets\/Home-\w{8}\.css"/ - ) - // JSX component preload registration - expect(html).toMatch( - /link rel="modulepreload".*?href="\/test\/assets\/Foo-\w{8}\.js"/ - ) - expect(html).toMatch( - /link rel="stylesheet".*?href="\/test\/assets\/Foo-\w{8}\.css"/ - ) - expect(html).not.toMatch( - /link rel="modulepreload".*?href="\/test\/assets\/About-\w{8}\.js"/ - ) - expect(html).not.toMatch( - /link rel="stylesheet".*?href="\/test\/assets\/About-\w{8}\.css"/ - ) - } -}) - -test('css', async () => { - await page.goto(url) - if (isBuild) { - expect(await getColor('h1')).toBe('green') - expect(await getColor('.jsx')).toBe('blue') - } else { - // During dev, the CSS is loaded from async chunk and we may have to wait - // when the test runs concurrently. - await untilUpdated(() => getColor('h1'), 'green') - await untilUpdated(() => getColor('.jsx'), 'blue') - } -}) - -test('asset', async () => { - await page.goto(url) - // should have no 404s - browserLogs.forEach((msg) => { - expect(msg).not.toMatch('404') - }) - const img = await page.$('img') - expect(await img.getAttribute('src')).toMatch( - isBuild ? /\/test\/assets\/logo-\w{8}\.png/ : '/src/assets/logo.png' - ) -}) - -test('jsx', async () => { - await page.goto(url) - expect(await page.textContent('.jsx')).toMatch('from JSX') -}) - -test('virtual module', async () => { - await page.goto(url) - expect(await page.textContent('.virtual')).toMatch('hi') -}) - -test('nested virtual module', async () => { - await page.goto(url) - expect(await page.textContent('.nested-virtual')).toMatch('[success]') -}) - -test('hydration', async () => { - await untilBrowserLogAfter(() => page.goto(url), 'hydrated') - - expect(await page.textContent('button')).toMatch('0') - await page.click('button') - expect(await page.textContent('button')).toMatch('1') -}) - -test( - 'hmr', - async () => { - // This is test is flaky in Mac CI, but can't be reproduced locally. Wait until - // network idle to avoid the issue. TODO: This may be caused by a bug when - // modifying a file while loading, we should remove this guard - await page.goto(url, { waitUntil: 'networkidle' }) - editFile('src/pages/Home.vue', (code) => code.replace('Home', 'changed')) - await untilUpdated(() => page.textContent('h1'), 'changed') - }, - { retry: 3 } -) - -test('client navigation', async () => { - await untilBrowserLogAfter(() => page.goto(url), 'hydrated') - - await untilUpdated(() => page.textContent('a[href="/test/about"]'), 'About') - await page.click('a[href="/test/about"]') - await untilUpdated(() => page.textContent('h1'), 'About') - editFile('src/pages/About.vue', (code) => code.replace('About', 'changed')) - await untilUpdated(() => page.textContent('h1'), 'changed') - await page.click('a[href="/test/"]') - await untilUpdated(() => page.textContent('a[href="/test/"]'), 'Home') -}) - -test('import.meta.url', async () => { - await page.goto(url) - expect(await page.textContent('.protocol')).toEqual('file:') -}) - -test.runIf(isBuild)('dynamic css file should be preloaded', async () => { - await page.goto(url) - const homeHtml = await (await fetch(url)).text() - const re = - /link rel="modulepreload".*?href="\/test\/assets\/(Home-\w{8}\.js)"/ - const filename = re.exec(homeHtml)[1] - const manifest = ( - await import( - resolve( - process.cwd(), - './playground-temp/ssr-vue/dist/client/ssr-manifest.json' - ) - ) - ).default - const depFile = manifest[filename] - for (const file of depFile) { - expect(homeHtml).toMatch(file) - } -}) - -test.runIf(!isBuild)( - 'always throw error when evaluating an wrong SSR module', - async () => { - const __filename = fileURLToPath(import.meta.url) - const badjs = resolve(__filename, '../fixtures/ssrModuleLoader-bad.js') - const THROW_MESSAGE = 'it is an expected error' - - const spy = vi.spyOn(console, 'error').mockImplementation(() => {}) - const expectedErrors = [] - for (const _ of [0, 1]) { - try { - console.log(viteServer) - await viteServer.ssrLoadModule(badjs, { fixStacktrace: true }) - } catch (e) { - expectedErrors.push(e) - } - } - expect(expectedErrors).toHaveLength(2) - expect(expectedErrors[0]).toBe(expectedErrors[1]) - expectedErrors.forEach((error) => { - expect(error?.message).toContain(THROW_MESSAGE) - }) - expect(spy).toBeCalledTimes(1) - const [firstParameter] = spy.mock.calls[0] - expect(firstParameter).toContain('Error when evaluating SSR module') - expect(firstParameter).toContain(THROW_MESSAGE) - spy.mockClear() - } -) diff --git a/playground/ssr-vue/dep-import-type/deep/index.d.ts b/playground/ssr-vue/dep-import-type/deep/index.d.ts deleted file mode 100644 index 39df3b83f7e9b8..00000000000000 --- a/playground/ssr-vue/dep-import-type/deep/index.d.ts +++ /dev/null @@ -1 +0,0 @@ -export interface Foo {} diff --git a/playground/ssr-vue/dep-import-type/package.json b/playground/ssr-vue/dep-import-type/package.json deleted file mode 100644 index 935f28eb7f7157..00000000000000 --- a/playground/ssr-vue/dep-import-type/package.json +++ /dev/null @@ -1,6 +0,0 @@ -{ - "name": "dep-import-type", - "private": true, - "version": "0.0.0", - "main": "index.js" -} diff --git a/playground/ssr-vue/example-external-component/ExampleExternalComponent.vue b/playground/ssr-vue/example-external-component/ExampleExternalComponent.vue deleted file mode 100644 index 55f3cea40e0399..00000000000000 --- a/playground/ssr-vue/example-external-component/ExampleExternalComponent.vue +++ /dev/null @@ -1,3 +0,0 @@ - diff --git a/playground/ssr-vue/example-external-component/index.js b/playground/ssr-vue/example-external-component/index.js deleted file mode 100644 index 8fc72c3aee0652..00000000000000 --- a/playground/ssr-vue/example-external-component/index.js +++ /dev/null @@ -1,3 +0,0 @@ -import ExampleExternalComponent from './ExampleExternalComponent.vue' - -export default ExampleExternalComponent diff --git a/playground/ssr-vue/example-external-component/package.json b/playground/ssr-vue/example-external-component/package.json deleted file mode 100644 index f1fd45bc5655ad..00000000000000 --- a/playground/ssr-vue/example-external-component/package.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "name": "example-external-component", - "private": true, - "version": "0.0.0", - "type": "module", - "main": "index.js" -} diff --git a/playground/ssr-vue/index.html b/playground/ssr-vue/index.html deleted file mode 100644 index 17b46a2f7a2267..00000000000000 --- a/playground/ssr-vue/index.html +++ /dev/null @@ -1,13 +0,0 @@ - - - - - - Vite App - - - -
- - - diff --git a/playground/ssr-vue/package.json b/playground/ssr-vue/package.json deleted file mode 100644 index 88fbb46811d20a..00000000000000 --- a/playground/ssr-vue/package.json +++ /dev/null @@ -1,31 +0,0 @@ -{ - "name": "test-ssr-vue", - "private": true, - "version": "0.0.0", - "type": "module", - "scripts": { - "dev": "node server", - "build": "npm run build:client && npm run build:server", - "build:noExternal": "npm run build:client && npm run build:server:noExternal", - "build:client": "vite build --ssrManifest --outDir dist/client", - "build:server": "vite build --ssr src/entry-server.js --outDir dist/server", - "build:server:noExternal": "vite build --config vite.config.noexternal.js --ssr src/entry-server.js --outDir dist/server", - "generate": "vite build --ssrManifest --outDir dist/static && npm run build:server && node prerender", - "serve": "NODE_ENV=production node server", - "debug": "node --inspect-brk server" - }, - "dependencies": { - "example-external-component": "file:example-external-component", - "pinia": "^2.0.27", - "vue": "^3.2.45", - "vue-router": "^4.1.6" - }, - "devDependencies": { - "@vitejs/plugin-vue": "^4.0.0-alpha.0", - "@vitejs/plugin-vue-jsx": "^3.0.0-alpha.0", - "compression": "^1.7.4", - "dep-import-type": "link:./dep-import-type", - "express": "^4.18.2", - "serve-static": "^1.15.0" - } -} diff --git a/playground/ssr-vue/prerender.js b/playground/ssr-vue/prerender.js deleted file mode 100644 index 97f42835a3eda6..00000000000000 --- a/playground/ssr-vue/prerender.js +++ /dev/null @@ -1,42 +0,0 @@ -// Pre-render the app into static HTML. -// run `npm run generate` and then `dist/static` can be served as a static site. - -import fs from 'node:fs' -import path from 'node:path' -import url from 'node:url' - -const __dirname = path.dirname(url.fileURLToPath(import.meta.url)) - -const toAbsolute = (p) => path.resolve(__dirname, p) - -const manifest = JSON.parse( - fs.readFileSync(toAbsolute('dist/static/ssr-manifest.json'), 'utf-8') -) -const template = fs.readFileSync(toAbsolute('dist/static/index.html'), 'utf-8') -const { render } = await import('./dist/server/entry-server.js') - -// determine routes to pre-render from src/pages -const routesToPrerender = fs - .readdirSync(toAbsolute('src/pages')) - .map((file) => { - const name = file.replace(/\.vue$/, '').toLowerCase() - return name === 'home' ? `/` : `/${name}` - }) - -;(async () => { - // pre-render each route... - for (const url of routesToPrerender) { - const [appHtml, preloadLinks] = await render(url, manifest) - - const html = template - .replace(``, preloadLinks) - .replace(``, appHtml) - - const filePath = `dist/static${url === '/' ? '/index' : url}.html` - fs.writeFileSync(toAbsolute(filePath), html) - console.log('pre-rendered:', filePath) - } - - // done, delete ssr manifest - fs.unlinkSync(toAbsolute('dist/static/ssr-manifest.json')) -})() diff --git a/playground/ssr-vue/server.js b/playground/ssr-vue/server.js deleted file mode 100644 index 18cedbce9c5ea3..00000000000000 --- a/playground/ssr-vue/server.js +++ /dev/null @@ -1,105 +0,0 @@ -// @ts-check -import fs from 'node:fs' -import path from 'node:path' -import { fileURLToPath } from 'node:url' -import express from 'express' - -const isTest = process.env.VITEST - -export async function createServer( - root = process.cwd(), - isProd = process.env.NODE_ENV === 'production', - hmrPort -) { - const __dirname = path.dirname(fileURLToPath(import.meta.url)) - const resolve = (p) => path.resolve(__dirname, p) - - const indexProd = isProd - ? fs.readFileSync(resolve('dist/client/index.html'), 'utf-8') - : '' - - const manifest = isProd - ? JSON.parse( - fs.readFileSync(resolve('dist/client/ssr-manifest.json'), 'utf-8') - ) - : {} - - const app = express() - - /** - * @type {import('vite').ViteDevServer} - */ - let vite - if (!isProd) { - vite = await ( - await import('vite') - ).createServer({ - base: '/test/', - root, - logLevel: isTest ? 'error' : 'info', - server: { - middlewareMode: true, - watch: { - // During tests we edit the files too fast and sometimes chokidar - // misses change events, so enforce polling for consistency - usePolling: true, - interval: 100 - }, - hmr: { - port: hmrPort - } - }, - appType: 'custom' - }) - // use vite's connect instance as middleware - app.use(vite.middlewares) - } else { - app.use((await import('compression')).default()) - app.use( - '/test/', - (await import('serve-static')).default(resolve('dist/client'), { - index: false - }) - ) - } - - app.use('*', async (req, res) => { - try { - const url = req.originalUrl.replace('/test/', '/') - - let template, render - if (!isProd) { - // always read fresh template in dev - template = fs.readFileSync(resolve('index.html'), 'utf-8') - template = await vite.transformIndexHtml(url, template) - render = (await vite.ssrLoadModule('/src/entry-server.js')).render - } else { - template = indexProd - // @ts-ignore - render = (await import('./dist/server/entry-server.js')).render - } - - const [appHtml, preloadLinks] = await render(url, manifest) - - const html = template - .replace(``, preloadLinks) - .replace(``, appHtml) - - res.status(200).set({ 'Content-Type': 'text/html' }).end(html) - } catch (e) { - vite && vite.ssrFixStacktrace(e) - console.log(e.stack) - res.status(500).end(e.stack) - } - }) - - return { app, vite } -} - -if (!isTest) { - createServer().then(({ app }) => - app.listen(6173, () => { - console.log('http://localhost:6173') - }) - ) -} diff --git a/playground/ssr-vue/src/App.vue b/playground/ssr-vue/src/App.vue deleted file mode 100644 index d824089ef249e4..00000000000000 --- a/playground/ssr-vue/src/App.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - diff --git a/playground/ssr-vue/src/assets/button.css b/playground/ssr-vue/src/assets/button.css deleted file mode 100644 index 8e1ebc58c0891f..00000000000000 --- a/playground/ssr-vue/src/assets/button.css +++ /dev/null @@ -1,15 +0,0 @@ -.btn { - background-color: #65b587; - border-radius: 8px; - border-style: none; - box-sizing: border-box; - cursor: pointer; - display: inline-block; - font-size: 14px; - font-weight: 500; - height: 40px; - line-height: 20px; - list-style: none; - outline: none; - padding: 10px 16px; -} diff --git a/playground/ssr-vue/src/assets/fonts/Inter-Italic.woff b/playground/ssr-vue/src/assets/fonts/Inter-Italic.woff deleted file mode 100644 index e7da6663fe5e47..00000000000000 Binary files a/playground/ssr-vue/src/assets/fonts/Inter-Italic.woff and /dev/null differ diff --git a/playground/ssr-vue/src/assets/fonts/Inter-Italic.woff2 b/playground/ssr-vue/src/assets/fonts/Inter-Italic.woff2 deleted file mode 100644 index 8559dfde38986e..00000000000000 Binary files a/playground/ssr-vue/src/assets/fonts/Inter-Italic.woff2 and /dev/null differ diff --git a/playground/ssr-vue/src/assets/logo.png b/playground/ssr-vue/src/assets/logo.png deleted file mode 100644 index f3d2503fc2a44b..00000000000000 Binary files a/playground/ssr-vue/src/assets/logo.png and /dev/null differ diff --git a/playground/ssr-vue/src/components/Foo.jsx b/playground/ssr-vue/src/components/Foo.jsx deleted file mode 100644 index 427815b2d252d2..00000000000000 --- a/playground/ssr-vue/src/components/Foo.jsx +++ /dev/null @@ -1,10 +0,0 @@ -import { defineComponent } from 'vue' -import './foo.css' - -// named exports w/ variable declaration: ok -export const Foo = defineComponent({ - name: 'foo', - setup() { - return () =>
from JSX
- } -}) diff --git a/playground/ssr-vue/src/components/ImportType.vue b/playground/ssr-vue/src/components/ImportType.vue deleted file mode 100644 index 144d36bc34e7ec..00000000000000 --- a/playground/ssr-vue/src/components/ImportType.vue +++ /dev/null @@ -1,8 +0,0 @@ - - - diff --git a/playground/ssr-vue/src/components/button.js b/playground/ssr-vue/src/components/button.js deleted file mode 100644 index 3b39f53fd96c47..00000000000000 --- a/playground/ssr-vue/src/components/button.js +++ /dev/null @@ -1,16 +0,0 @@ -import { createVNode, defineComponent } from 'vue' -import '../assets/button.css' - -export default defineComponent({ - setup() { - return () => { - return createVNode( - 'div', - { - class: 'btn' - }, - 'dynamicBtn' - ) - } - } -}) diff --git a/playground/ssr-vue/src/components/foo.css b/playground/ssr-vue/src/components/foo.css deleted file mode 100644 index f8baa0d15b90d3..00000000000000 --- a/playground/ssr-vue/src/components/foo.css +++ /dev/null @@ -1,3 +0,0 @@ -.jsx { - color: blue; -} diff --git a/playground/ssr-vue/src/entry-client.js b/playground/ssr-vue/src/entry-client.js deleted file mode 100644 index a99b84f2f69a80..00000000000000 --- a/playground/ssr-vue/src/entry-client.js +++ /dev/null @@ -1,10 +0,0 @@ -import { createApp } from './main' - -const { app, router } = createApp() - -// wait until router is ready before mounting to ensure hydration match -router.isReady().then(() => { - app.mount('#app') - - console.log('hydrated') -}) diff --git a/playground/ssr-vue/src/entry-server.js b/playground/ssr-vue/src/entry-server.js deleted file mode 100644 index e44c9abd3eb114..00000000000000 --- a/playground/ssr-vue/src/entry-server.js +++ /dev/null @@ -1,69 +0,0 @@ -import { basename } from 'node:path' -import { renderToString } from 'vue/server-renderer' -import { createApp } from './main' - -export async function render(url, manifest) { - const { app, router } = createApp() - - // set the router to the desired URL before rendering - await router.push(url) - await router.isReady() - - // passing SSR context object which will be available via useSSRContext() - // @vitejs/plugin-vue injects code into a component's setup() that registers - // itself on ctx.modules. After the render, ctx.modules would contain all the - // components that have been instantiated during this render call. - const ctx = {} - const html = await renderToString(app, ctx) - - // the SSR manifest generated by Vite contains module -> chunk/asset mapping - // which we can then use to determine what files need to be preloaded for this - // request. - const preloadLinks = renderPreloadLinks(ctx.modules, manifest) - return [html, preloadLinks] -} - -function renderPreloadLinks(modules, manifest) { - let links = '' - const seen = new Set() - modules.forEach((id) => { - const files = manifest[id] - if (files) { - files.forEach((file) => { - if (!seen.has(file)) { - seen.add(file) - const filename = basename(file) - if (manifest[filename]) { - for (const depFile of manifest[filename]) { - links += renderPreloadLink(depFile) - seen.add(depFile) - } - } - links += renderPreloadLink(file) - } - }) - } - }) - return links -} - -function renderPreloadLink(file) { - if (file.endsWith('.js')) { - return `` - } else if (file.endsWith('.css')) { - return `` - } else if (file.endsWith('.woff')) { - return ` ` - } else if (file.endsWith('.woff2')) { - return ` ` - } else if (file.endsWith('.gif')) { - return ` ` - } else if (file.endsWith('.jpg') || file.endsWith('.jpeg')) { - return ` ` - } else if (file.endsWith('.png')) { - return ` ` - } else { - // TODO - return '' - } -} diff --git a/playground/ssr-vue/src/main.js b/playground/ssr-vue/src/main.js deleted file mode 100644 index d2dd1e002147fe..00000000000000 --- a/playground/ssr-vue/src/main.js +++ /dev/null @@ -1,16 +0,0 @@ -import { createPinia } from 'pinia' -import { createSSRApp } from 'vue' -import App from './App.vue' -import { createRouter } from './router' - -// SSR requires a fresh app instance per request, therefore we export a function -// that creates a fresh app instance. If using Vuex, we'd also be creating a -// fresh store here. -export function createApp() { - const app = createSSRApp(App) - const pinia = createPinia() - app.use(pinia) - const router = createRouter() - app.use(router) - return { app, router } -} diff --git a/playground/ssr-vue/src/pages/About.vue b/playground/ssr-vue/src/pages/About.vue deleted file mode 100644 index ea6510808fd943..00000000000000 --- a/playground/ssr-vue/src/pages/About.vue +++ /dev/null @@ -1,30 +0,0 @@ - - - - - diff --git a/playground/ssr-vue/src/pages/External.vue b/playground/ssr-vue/src/pages/External.vue deleted file mode 100644 index ffdcd03b85be84..00000000000000 --- a/playground/ssr-vue/src/pages/External.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/playground/ssr-vue/src/pages/Home.vue b/playground/ssr-vue/src/pages/Home.vue deleted file mode 100644 index 7f595e7437e600..00000000000000 --- a/playground/ssr-vue/src/pages/Home.vue +++ /dev/null @@ -1,51 +0,0 @@ - - - - - diff --git a/playground/ssr-vue/src/pages/Store.vue b/playground/ssr-vue/src/pages/Store.vue deleted file mode 100644 index 60a19217e55645..00000000000000 --- a/playground/ssr-vue/src/pages/Store.vue +++ /dev/null @@ -1,25 +0,0 @@ - - - - - diff --git a/playground/ssr-vue/src/router.js b/playground/ssr-vue/src/router.js deleted file mode 100644 index 814098102d7899..00000000000000 --- a/playground/ssr-vue/src/router.js +++ /dev/null @@ -1,28 +0,0 @@ -import { - createRouter as _createRouter, - createMemoryHistory, - createWebHistory -} from 'vue-router' - -// Auto generates routes from vue files under ./pages -// https://vitejs.dev/guide/features.html#glob-import -const pages = import.meta.glob('./pages/*.vue') - -const routes = Object.keys(pages).map((path) => { - const name = path.match(/\.\/pages(.*)\.vue$/)[1].toLowerCase() - return { - path: name === '/home' ? '/' : name, - component: pages[path] // () => import('./pages/*.vue') - } -}) - -export function createRouter() { - return _createRouter({ - // use appropriate history implementation for server/client - // import.meta.env.SSR is injected by Vite. - history: import.meta.env.SSR - ? createMemoryHistory('/test/') - : createWebHistory('/test/'), - routes - }) -} diff --git a/playground/ssr-vue/vite.config.js b/playground/ssr-vue/vite.config.js deleted file mode 100644 index c8be7320c8a9b0..00000000000000 --- a/playground/ssr-vue/vite.config.js +++ /dev/null @@ -1,126 +0,0 @@ -import path from 'node:path' -import { defineConfig } from 'vite' -import vuePlugin from '@vitejs/plugin-vue' -import vueJsx from '@vitejs/plugin-vue-jsx' - -const virtualFile = '@virtual-file' -const virtualId = '\0' + virtualFile -const nestedVirtualFile = '@nested-virtual-file' -const nestedVirtualId = '\0' + nestedVirtualFile - -const base = '/test/' - -// preserve this to test loading __filename & __dirname in ESM as Vite polyfills them. -// if Vite incorrectly load this file, node.js would error out. -globalThis.__vite_test_filename = __filename -globalThis.__vite_test_dirname = __dirname - -export default defineConfig(({ command, ssrBuild }) => ({ - base, - plugins: [ - vuePlugin(), - vueJsx(), - { - name: 'virtual', - resolveId(id) { - if (id === '@foo') { - return id - } - }, - load(id, options) { - const ssrFromOptions = options?.ssr ?? false - if (id === '@foo') { - // Force a mismatch error if ssrBuild is different from ssrFromOptions - return `export default { msg: '${ - command === 'build' && !!ssrBuild !== ssrFromOptions - ? `defineConfig ssrBuild !== ssr from load options` - : 'hi' - }' }` - } - } - }, - { - name: 'virtual-module', - resolveId(id) { - if (id === virtualFile) { - return virtualId - } else if (id === nestedVirtualFile) { - return nestedVirtualId - } - }, - load(id) { - if (id === virtualId) { - return `export { msg } from "@nested-virtual-file";` - } else if (id === nestedVirtualId) { - return `export const msg = "[success] from conventional virtual file"` - } - } - }, - // Example of a plugin that injects a helper from a virtual module that can - // be used in renderBuiltUrl - (function () { - const queryRE = /\?.*$/s - const hashRE = /#.*$/s - const cleanUrl = (url) => url.replace(hashRE, '').replace(queryRE, '') - let config - - const virtualId = '\0virtual:ssr-vue-built-url' - return { - name: 'built-url', - enforce: 'post', - configResolved(_config) { - config = _config - }, - resolveId(id) { - if (id === virtualId) { - return id - } - }, - load(id) { - if (id === virtualId) { - return { - code: `export const __ssr_vue_processAssetPath = (url) => '${base}' + url`, - moduleSideEffects: 'no-treeshake' - } - } - }, - transform(code, id) { - const cleanId = cleanUrl(id) - if ( - config.build.ssr && - (cleanId.endsWith('.js') || cleanId.endsWith('.vue')) && - !code.includes('__ssr_vue_processAssetPath') - ) { - return { - code: - `import { __ssr_vue_processAssetPath } from '${virtualId}';__ssr_vue_processAssetPath;` + - code, - sourcemap: null // no sourcemap support to speed up CI - } - } - } - } - })() - ], - experimental: { - renderBuiltUrl(filename, { hostType, type, ssr }) { - if (ssr && type === 'asset' && hostType === 'js') { - return { - runtime: `__ssr_vue_processAssetPath(${JSON.stringify(filename)})` - } - } - } - }, - build: { - minify: false - }, - ssr: { - noExternal: [ - // this package has uncompiled .vue files - 'example-external-component' - ] - }, - optimizeDeps: { - exclude: ['example-external-component'] - } -})) diff --git a/playground/ssr-vue/vite.config.noexternal.js b/playground/ssr-vue/vite.config.noexternal.js deleted file mode 100644 index 48a740c16cb1bf..00000000000000 --- a/playground/ssr-vue/vite.config.noexternal.js +++ /dev/null @@ -1,25 +0,0 @@ -import config from './vite.config.js' -/** - * @type {import('vite').UserConfig} - */ -export default Object.assign(config, { - ssr: { - noExternal: /./ - }, - resolve: { - // necessary because vue.ssrUtils is only exported on cjs modules - alias: [ - { - find: '@vue/runtime-dom', - replacement: '@vue/runtime-dom/dist/runtime-dom.cjs.js' - }, - { - find: '@vue/runtime-core', - replacement: '@vue/runtime-core/dist/runtime-core.cjs.js' - } - ] - }, - optimizeDeps: { - exclude: ['example-external-component'] - } -}) diff --git a/playground/test-utils.ts b/playground/test-utils.ts index a1bb4ad31dc30d..80e04bffb8bd02 100644 --- a/playground/test-utils.ts +++ b/playground/test-utils.ts @@ -26,8 +26,6 @@ export const ports = { 'ssr-html': 9601, 'ssr-noexternal': 9602, 'ssr-pug': 9603, - 'ssr-react': 9604, - 'ssr-vue': 9605, 'ssr-webworker': 9606, 'css/postcss-caching': 5005, 'css/postcss-plugins-different-dir': 5006, @@ -38,9 +36,7 @@ export const hmrPorts = { 'ssr-deps': 24681, 'ssr-html': 24682, 'ssr-noexternal': 24683, - 'ssr-pug': 24684, - 'ssr-react': 24685, - 'ssr-vue': 24686 + 'ssr-pug': 24684 } const hexToNameMap: Record = {} diff --git a/playground/vue-jsx/Comp.tsx b/playground/vue-jsx/Comp.tsx deleted file mode 100644 index fe8add4d428a2c..00000000000000 --- a/playground/vue-jsx/Comp.tsx +++ /dev/null @@ -1,14 +0,0 @@ -import { defineComponent, ref } from 'vue' - -const Default = defineComponent(() => { - const count = ref(3) - const inc = () => count.value++ - - return () => ( - - ) -}) - -export default Default diff --git a/playground/vue-jsx/Comps.jsx b/playground/vue-jsx/Comps.jsx deleted file mode 100644 index e5cc405a77581b..00000000000000 --- a/playground/vue-jsx/Comps.jsx +++ /dev/null @@ -1,35 +0,0 @@ -import { defineComponent, ref } from 'vue' - -export const Named = defineComponent(() => { - const count = ref(0) - const inc = () => count.value++ - - return () => ( - - ) -}) - -const NamedSpec = defineComponent(() => { - const count = ref(1) - const inc = () => count.value++ - - return () => ( - - ) -}) -export { NamedSpec } - -export default defineComponent(() => { - const count = ref(2) - const inc = () => count.value++ - - return () => ( - - ) -}) diff --git a/playground/vue-jsx/OtherExt.tesx b/playground/vue-jsx/OtherExt.tesx deleted file mode 100644 index 7ae585a014c566..00000000000000 --- a/playground/vue-jsx/OtherExt.tesx +++ /dev/null @@ -1,9 +0,0 @@ -import { defineComponent } from 'vue' - -const Default = defineComponent(() => { - return () => ( -

Other Ext

- ) -}) - -export default Default diff --git a/playground/vue-jsx/Query.jsx b/playground/vue-jsx/Query.jsx deleted file mode 100644 index 60de93eafb7b1c..00000000000000 --- a/playground/vue-jsx/Query.jsx +++ /dev/null @@ -1,12 +0,0 @@ -import { defineComponent, ref } from 'vue' - -export default defineComponent(() => { - const count = ref(6) - const inc = () => count.value++ - - return () => ( - - ) -}) diff --git a/playground/vue-jsx/Script.vue b/playground/vue-jsx/Script.vue deleted file mode 100644 index 2689ed2dfe6ffb..00000000000000 --- a/playground/vue-jsx/Script.vue +++ /dev/null @@ -1,14 +0,0 @@ - diff --git a/playground/vue-jsx/SrcImport.jsx b/playground/vue-jsx/SrcImport.jsx deleted file mode 100644 index dc775be205af73..00000000000000 --- a/playground/vue-jsx/SrcImport.jsx +++ /dev/null @@ -1,12 +0,0 @@ -import { defineComponent, ref } from 'vue' - -export default defineComponent(() => { - const count = ref(5) - const inc = () => count.value++ - - return () => ( - - ) -}) diff --git a/playground/vue-jsx/SrcImport.vue b/playground/vue-jsx/SrcImport.vue deleted file mode 100644 index 89f6fb3eb77e2b..00000000000000 --- a/playground/vue-jsx/SrcImport.vue +++ /dev/null @@ -1 +0,0 @@ - diff --git a/playground/vue-jsx/TsImport.vue b/playground/vue-jsx/TsImport.vue deleted file mode 100644 index c63923d51947fa..00000000000000 --- a/playground/vue-jsx/TsImport.vue +++ /dev/null @@ -1,8 +0,0 @@ - - - diff --git a/playground/vue-jsx/TsImportFile.ts b/playground/vue-jsx/TsImportFile.ts deleted file mode 100644 index 62761d5733b432..00000000000000 --- a/playground/vue-jsx/TsImportFile.ts +++ /dev/null @@ -1 +0,0 @@ -export const foo = 'success' diff --git a/playground/vue-jsx/__tests__/vue-jsx.spec.ts b/playground/vue-jsx/__tests__/vue-jsx.spec.ts deleted file mode 100644 index 7518f4bddd7c71..00000000000000 --- a/playground/vue-jsx/__tests__/vue-jsx.spec.ts +++ /dev/null @@ -1,117 +0,0 @@ -import { describe, expect, test } from 'vitest' -import { editFile, isServe, page, untilUpdated } from '~utils' - -test('should render', async () => { - expect(await page.textContent('.named')).toMatch('0') - expect(await page.textContent('.named-specifier')).toMatch('1') - expect(await page.textContent('.default')).toMatch('2') - expect(await page.textContent('.default-tsx')).toMatch('3') - expect(await page.textContent('.script')).toMatch('4') - expect(await page.textContent('.src-import')).toMatch('5') - expect(await page.textContent('.jsx-with-query')).toMatch('6') - expect(await page.textContent('.other-ext')).toMatch('Other Ext') - expect(await page.textContent('.ts-import')).toMatch('success') -}) - -test('should update', async () => { - await page.click('.named') - expect(await page.textContent('.named')).toMatch('1') - await page.click('.named-specifier') - expect(await page.textContent('.named-specifier')).toMatch('2') - await page.click('.default') - expect(await page.textContent('.default')).toMatch('3') - await page.click('.default-tsx') - expect(await page.textContent('.default-tsx')).toMatch('4') - await page.click('.script') - expect(await page.textContent('.script')).toMatch('5') - await page.click('.src-import') - expect(await page.textContent('.src-import')).toMatch('6') - await page.click('.jsx-with-query') - expect(await page.textContent('.jsx-with-query')).toMatch('7') -}) - -describe.runIf(isServe)('vue-jsx server', () => { - test('hmr: named export', async () => { - editFile('Comps.jsx', (code) => - code.replace('named {count', 'named updated {count') - ) - await untilUpdated(() => page.textContent('.named'), 'named updated 0') - - // affect all components in same file - expect(await page.textContent('.named-specifier')).toMatch('1') - expect(await page.textContent('.default')).toMatch('2') - // should not affect other components from different file - expect(await page.textContent('.default-tsx')).toMatch('4') - }) - - test('hmr: named export via specifier', async () => { - editFile('Comps.jsx', (code) => - code.replace('named specifier {count', 'named specifier updated {count') - ) - await untilUpdated( - () => page.textContent('.named-specifier'), - 'named specifier updated 1' - ) - - // affect all components in same file - expect(await page.textContent('.default')).toMatch('2') - // should not affect other components on the page - expect(await page.textContent('.default-tsx')).toMatch('4') - }) - - test('hmr: default export', async () => { - editFile('Comps.jsx', (code) => - code.replace('default {count', 'default updated {count') - ) - await untilUpdated(() => page.textContent('.default'), 'default updated 2') - - // should not affect other components on the page - expect(await page.textContent('.default-tsx')).toMatch('4') - }) - - test('hmr: named export via specifier', async () => { - // update another component - await page.click('.named') - expect(await page.textContent('.named')).toMatch('1') - - editFile('Comp.tsx', (code) => - code.replace('default tsx {count', 'default tsx updated {count') - ) - await untilUpdated( - () => page.textContent('.default-tsx'), - 'default tsx updated 3' - ) - - // should not affect other components on the page - expect(await page.textContent('.named')).toMatch('1') - }) - - test('hmr: script in .vue', async () => { - editFile('Script.vue', (code) => - code.replace('script {count', 'script updated {count') - ) - await untilUpdated(() => page.textContent('.script'), 'script updated 4') - - expect(await page.textContent('.src-import')).toMatch('6') - }) - - test('hmr: src import in .vue', async () => { - await page.click('.script') - editFile('SrcImport.jsx', (code) => - code.replace('src import {count', 'src import updated {count') - ) - await untilUpdated( - () => page.textContent('.src-import'), - 'src import updated 5' - ) - - expect(await page.textContent('.script')).toMatch('5') - }) - - test('hmr: setup jsx in .vue', async () => { - editFile('setup-syntax-jsx.vue', (code) => - code.replace('let count = ref(100)', 'let count = ref(1000)') - ) - await untilUpdated(() => page.textContent('.setup-jsx'), '1000') - }) -}) diff --git a/playground/vue-jsx/index.html b/playground/vue-jsx/index.html deleted file mode 100644 index a285a008c13a9e..00000000000000 --- a/playground/vue-jsx/index.html +++ /dev/null @@ -1,2 +0,0 @@ -
- diff --git a/playground/vue-jsx/main.jsx b/playground/vue-jsx/main.jsx deleted file mode 100644 index f13e60c45367c0..00000000000000 --- a/playground/vue-jsx/main.jsx +++ /dev/null @@ -1,29 +0,0 @@ -import { createApp } from 'vue' -import { Named, NamedSpec, default as Default } from './Comps' -import { default as TsxDefault } from './Comp' -import OtherExt from './OtherExt.tesx' -import JsxScript from './Script.vue' -import JsxSrcImport from './SrcImport.vue' -import JsxSetupSyntax from './setup-syntax-jsx.vue' -// eslint-disable-next-line -import JsxWithQuery from './Query.jsx?query=true' -import TsImport from './TsImport.vue' - -function App() { - return ( - <> - - - - - - - - - - - - ) -} - -createApp(App).mount('#app') diff --git a/playground/vue-jsx/package.json b/playground/vue-jsx/package.json deleted file mode 100644 index b0d1496799223e..00000000000000 --- a/playground/vue-jsx/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "test-vue-jsx", - "private": true, - "version": "0.0.0", - "scripts": { - "dev": "vite", - "build": "vite build", - "debug": "node --inspect-brk ../../packages/vite/bin/vite", - "preview": "vite preview" - }, - "dependencies": { - "vue": "^3.2.45" - }, - "devDependencies": { - "@vitejs/plugin-vue": "^4.0.0-alpha.0", - "@vitejs/plugin-vue-jsx": "^3.0.0-alpha.0" - } -} diff --git a/playground/vue-jsx/setup-syntax-jsx.vue b/playground/vue-jsx/setup-syntax-jsx.vue deleted file mode 100644 index 0b16be7e773280..00000000000000 --- a/playground/vue-jsx/setup-syntax-jsx.vue +++ /dev/null @@ -1,17 +0,0 @@ - - - diff --git a/playground/vue-jsx/vite.config.js b/playground/vue-jsx/vite.config.js deleted file mode 100644 index 2f4ea255c95094..00000000000000 --- a/playground/vue-jsx/vite.config.js +++ /dev/null @@ -1,42 +0,0 @@ -const vueJsxPlugin = require('@vitejs/plugin-vue-jsx') -const vuePlugin = require('@vitejs/plugin-vue') - -/** - * @type {import('vite').UserConfig} - */ -module.exports = { - plugins: [ - vueJsxPlugin({ - include: [/\.tesx$/, /\.[jt]sx$/] - }), - vuePlugin(), - { - name: 'jsx-query-plugin', - transform(code, id) { - if (id.includes('?query=true')) { - return ` -import { createVNode as _createVNode } from "vue"; -import { defineComponent, ref } from 'vue'; -export default defineComponent(() => { - const count = ref(6); - - const inc = () => count.value++; - - return () => _createVNode("button", { - "class": "jsx-with-query", - "onClick": inc - }, [count.value]); -}); -` - } - } - } - ], - build: { - // to make tests faster - minify: false - }, - optimizeDeps: { - disabled: true - } -} diff --git a/playground/vue-legacy/Main.vue b/playground/vue-legacy/Main.vue deleted file mode 100644 index a582c2e6aa6d62..00000000000000 --- a/playground/vue-legacy/Main.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - diff --git a/playground/vue-legacy/__tests__/vue-legacy.spec.ts b/playground/vue-legacy/__tests__/vue-legacy.spec.ts deleted file mode 100644 index 908e04567ca35b..00000000000000 --- a/playground/vue-legacy/__tests__/vue-legacy.spec.ts +++ /dev/null @@ -1,10 +0,0 @@ -import { test } from 'vitest' -import { getBg, untilUpdated } from '~utils' - -test('vue legacy assets', async () => { - await untilUpdated(() => getBg('.main'), 'assets/asset', true) -}) - -test('async vue legacy assets', async () => { - await untilUpdated(() => getBg('.module'), 'assets/asset', true) -}) diff --git a/playground/vue-legacy/assets/asset.png b/playground/vue-legacy/assets/asset.png deleted file mode 100644 index 1b3356a746b8bb..00000000000000 Binary files a/playground/vue-legacy/assets/asset.png and /dev/null differ diff --git a/playground/vue-legacy/env.d.ts b/playground/vue-legacy/env.d.ts deleted file mode 100644 index 31dca6bb40c906..00000000000000 --- a/playground/vue-legacy/env.d.ts +++ /dev/null @@ -1 +0,0 @@ -declare module '*.png' diff --git a/playground/vue-legacy/index.html b/playground/vue-legacy/index.html deleted file mode 100644 index 0f7b79435ed47d..00000000000000 --- a/playground/vue-legacy/index.html +++ /dev/null @@ -1,7 +0,0 @@ -
- diff --git a/playground/vue-legacy/inline.css b/playground/vue-legacy/inline.css deleted file mode 100644 index 2207a25763ca6d..00000000000000 --- a/playground/vue-legacy/inline.css +++ /dev/null @@ -1,3 +0,0 @@ -.inline-css { - color: #0088ff; -} diff --git a/playground/vue-legacy/module.vue b/playground/vue-legacy/module.vue deleted file mode 100644 index 10c7b42e4c4215..00000000000000 --- a/playground/vue-legacy/module.vue +++ /dev/null @@ -1,13 +0,0 @@ - - diff --git a/playground/vue-legacy/package.json b/playground/vue-legacy/package.json deleted file mode 100644 index f6d95702b77038..00000000000000 --- a/playground/vue-legacy/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "test-vue-legacy", - "private": true, - "version": "0.0.0", - "scripts": { - "dev": "vite", - "build": "vite build", - "debug": "node --inspect-brk ../../packages/vite/bin/vite", - "preview": "vite preview" - }, - "dependencies": { - "vue": "^3.2.45" - }, - "devDependencies": { - "@vitejs/plugin-vue": "^4.0.0-alpha.0", - "@vitejs/plugin-legacy": "workspace:*" - } -} diff --git a/playground/vue-legacy/vite.config.ts b/playground/vue-legacy/vite.config.ts deleted file mode 100644 index 5bb2f0efa06f53..00000000000000 --- a/playground/vue-legacy/vite.config.ts +++ /dev/null @@ -1,35 +0,0 @@ -import path from 'node:path' -import fs from 'node:fs' -import { defineConfig } from 'vite' -import vuePlugin from '@vitejs/plugin-vue' -import legacyPlugin from '@vitejs/plugin-legacy' - -export default defineConfig({ - base: '', - resolve: { - alias: { - '@': __dirname - } - }, - plugins: [ - legacyPlugin({ - targets: ['defaults', 'not IE 11', 'chrome > 48'] - }), - vuePlugin() - ], - build: { - minify: false - }, - // special test only hook - // for tests, remove ` - - diff --git a/playground/vue-lib/package.json b/playground/vue-lib/package.json deleted file mode 100644 index 964e36f1a89a31..00000000000000 --- a/playground/vue-lib/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "test-vue-lib", - "private": true, - "version": "0.0.0", - "scripts": { - "dev-consumer": "vite --config ./vite.config.consumer.ts", - "build-lib": "vite build --config ./vite.config.lib.ts", - "build-lib-css": "vite build --config ./vite.config.lib-css.ts", - "build-consumer": "vite build --config ./vite.config.consumer.ts" - }, - "dependencies": { - "vue": "^3.2.45" - }, - "devDependencies": { - "@vitejs/plugin-vue": "^4.0.0-alpha.0" - } -} diff --git a/playground/vue-lib/src-consumer/index.ts b/playground/vue-lib/src-consumer/index.ts deleted file mode 100644 index 880acf90238edf..00000000000000 --- a/playground/vue-lib/src-consumer/index.ts +++ /dev/null @@ -1,7 +0,0 @@ -import { createApp } from 'vue' -// @ts-ignore -import { CompA } from '../dist/lib/my-vue-lib' -import '../dist/lib/style.css' - -const app = createApp(CompA) -app.mount('#app') diff --git a/playground/vue-lib/src-lib-css/index.css b/playground/vue-lib/src-lib-css/index.css deleted file mode 100644 index 135f4787b30766..00000000000000 --- a/playground/vue-lib/src-lib-css/index.css +++ /dev/null @@ -1,3 +0,0 @@ -.card { - padding: 4rem; -} diff --git a/playground/vue-lib/src-lib-css/index.ts b/playground/vue-lib/src-lib-css/index.ts deleted file mode 100644 index 0da52ebb0b6115..00000000000000 --- a/playground/vue-lib/src-lib-css/index.ts +++ /dev/null @@ -1,3 +0,0 @@ -import './index.css' - -export function setup() {} diff --git a/playground/vue-lib/src-lib/CompA.vue b/playground/vue-lib/src-lib/CompA.vue deleted file mode 100644 index dac9298b3bedf4..00000000000000 --- a/playground/vue-lib/src-lib/CompA.vue +++ /dev/null @@ -1,8 +0,0 @@ - - diff --git a/playground/vue-lib/src-lib/CompB.vue b/playground/vue-lib/src-lib/CompB.vue deleted file mode 100644 index cca30168fb6753..00000000000000 --- a/playground/vue-lib/src-lib/CompB.vue +++ /dev/null @@ -1,8 +0,0 @@ - - diff --git a/playground/vue-lib/src-lib/index.ts b/playground/vue-lib/src-lib/index.ts deleted file mode 100644 index f83abd4ec72118..00000000000000 --- a/playground/vue-lib/src-lib/index.ts +++ /dev/null @@ -1,2 +0,0 @@ -export { default as CompA } from './CompA.vue' -export { default as CompB } from './CompB.vue' diff --git a/playground/vue-lib/vite.config.consumer.ts b/playground/vue-lib/vite.config.consumer.ts deleted file mode 100644 index 9e75b5cfbeabcb..00000000000000 --- a/playground/vue-lib/vite.config.consumer.ts +++ /dev/null @@ -1,10 +0,0 @@ -import { defineConfig } from 'vite' -import vue from '@vitejs/plugin-vue' - -export default defineConfig({ - root: __dirname, - build: { - outDir: 'dist/consumer' - }, - plugins: [vue()] -}) diff --git a/playground/vue-lib/vite.config.lib-css.ts b/playground/vue-lib/vite.config.lib-css.ts deleted file mode 100644 index e20ec925e05b0e..00000000000000 --- a/playground/vue-lib/vite.config.lib-css.ts +++ /dev/null @@ -1,16 +0,0 @@ -import path from 'node:path' -import { defineConfig } from 'vite' - -export default defineConfig({ - root: __dirname, - build: { - outDir: 'dist/lib', - cssCodeSplit: true, - lib: { - entry: path.resolve(__dirname, 'src-lib-css/index.ts'), - name: 'index', - formats: ['umd'], - fileName: 'index.js' - } - } -}) diff --git a/playground/vue-lib/vite.config.lib.ts b/playground/vue-lib/vite.config.lib.ts deleted file mode 100644 index 5be7ea876e9833..00000000000000 --- a/playground/vue-lib/vite.config.lib.ts +++ /dev/null @@ -1,23 +0,0 @@ -import path from 'node:path' -import { defineConfig } from 'vite' -import vue from '@vitejs/plugin-vue' - -export default defineConfig({ - root: __dirname, - build: { - outDir: 'dist/lib', - lib: { - entry: path.resolve(__dirname, 'src-lib/index.ts'), - name: 'MyVueLib', - formats: ['es'], - fileName: 'my-vue-lib' - }, - rollupOptions: { - external: ['vue'], - output: { - globals: { vue: 'Vue' } - } - } - }, - plugins: [vue()] -}) diff --git a/playground/vue-server-origin/Main.vue b/playground/vue-server-origin/Main.vue deleted file mode 100644 index 20e736542ec9cb..00000000000000 --- a/playground/vue-server-origin/Main.vue +++ /dev/null @@ -1,8 +0,0 @@ - - - diff --git a/playground/vue-server-origin/__tests__/vue-server-origin.spec.ts b/playground/vue-server-origin/__tests__/vue-server-origin.spec.ts deleted file mode 100644 index 2c640709cb3cf5..00000000000000 --- a/playground/vue-server-origin/__tests__/vue-server-origin.spec.ts +++ /dev/null @@ -1,11 +0,0 @@ -import { expect, test } from 'vitest' -import { isBuild, page } from '~utils' - -test('should render', async () => { - const expected = isBuild - ? /assets\/asset-[\da-f]+\.png/ - : 'http://localhost/server-origin/test/assets/asset.png' - - expect(await page.getAttribute('img', 'src')).toMatch(expected) - expect(await page.getAttribute('img:nth-child(2)', 'src')).toMatch(expected) -}) diff --git a/playground/vue-server-origin/assets/asset.png b/playground/vue-server-origin/assets/asset.png deleted file mode 100644 index 1b3356a746b8bb..00000000000000 Binary files a/playground/vue-server-origin/assets/asset.png and /dev/null differ diff --git a/playground/vue-server-origin/env.d.ts b/playground/vue-server-origin/env.d.ts deleted file mode 100644 index 31dca6bb40c906..00000000000000 --- a/playground/vue-server-origin/env.d.ts +++ /dev/null @@ -1 +0,0 @@ -declare module '*.png' diff --git a/playground/vue-server-origin/index.html b/playground/vue-server-origin/index.html deleted file mode 100644 index 13de0b72c23782..00000000000000 --- a/playground/vue-server-origin/index.html +++ /dev/null @@ -1,7 +0,0 @@ -
- diff --git a/playground/vue-server-origin/package.json b/playground/vue-server-origin/package.json deleted file mode 100644 index 8bdb5c2f45b1e5..00000000000000 --- a/playground/vue-server-origin/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "test-vue-server-origin", - "private": true, - "version": "0.0.0", - "scripts": { - "dev": "vite", - "build": "vite build", - "debug": "node --inspect-brk ../../packages/vite/bin/vite", - "preview": "vite preview" - }, - "dependencies": { - "vue": "^3.2.45" - }, - "devDependencies": { - "@vitejs/plugin-vue": "^4.0.0-alpha.0" - } -} diff --git a/playground/vue-server-origin/vite.config.ts b/playground/vue-server-origin/vite.config.ts deleted file mode 100644 index e6e497c2917f6b..00000000000000 --- a/playground/vue-server-origin/vite.config.ts +++ /dev/null @@ -1,19 +0,0 @@ -import { defineConfig } from 'vite' -import vuePlugin from '@vitejs/plugin-vue' - -export default defineConfig({ - base: '', - resolve: { - alias: { - '@': __dirname - } - }, - plugins: [vuePlugin()], - server: { - origin: 'http://localhost/server-origin/test' - }, - build: { - // to make tests faster - minify: false - } -}) diff --git a/playground/vue-sourcemap/Css.vue b/playground/vue-sourcemap/Css.vue deleted file mode 100644 index 4f677c7b84dfbd..00000000000000 --- a/playground/vue-sourcemap/Css.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - - - - - - - diff --git a/playground/vue-sourcemap/Js.vue b/playground/vue-sourcemap/Js.vue deleted file mode 100644 index 3a5577099f67d3..00000000000000 --- a/playground/vue-sourcemap/Js.vue +++ /dev/null @@ -1,11 +0,0 @@ - - - - - diff --git a/playground/vue-sourcemap/Less.vue b/playground/vue-sourcemap/Less.vue deleted file mode 100644 index f12a3e55f2111c..00000000000000 --- a/playground/vue-sourcemap/Less.vue +++ /dev/null @@ -1,9 +0,0 @@ - - - diff --git a/playground/vue-sourcemap/Main.vue b/playground/vue-sourcemap/Main.vue deleted file mode 100644 index 8b092e88d94aef..00000000000000 --- a/playground/vue-sourcemap/Main.vue +++ /dev/null @@ -1,24 +0,0 @@ - - - diff --git a/playground/vue-sourcemap/NoScript.vue b/playground/vue-sourcemap/NoScript.vue deleted file mode 100644 index 77e2de3414d1ea..00000000000000 --- a/playground/vue-sourcemap/NoScript.vue +++ /dev/null @@ -1,3 +0,0 @@ - diff --git a/playground/vue-sourcemap/NoTemplate.vue b/playground/vue-sourcemap/NoTemplate.vue deleted file mode 100644 index 9414a2913d68f4..00000000000000 --- a/playground/vue-sourcemap/NoTemplate.vue +++ /dev/null @@ -1,7 +0,0 @@ - - - diff --git a/playground/vue-sourcemap/Sass.vue b/playground/vue-sourcemap/Sass.vue deleted file mode 100644 index 0fded031a52c72..00000000000000 --- a/playground/vue-sourcemap/Sass.vue +++ /dev/null @@ -1,8 +0,0 @@ - - - diff --git a/playground/vue-sourcemap/SassWithImport.vue b/playground/vue-sourcemap/SassWithImport.vue deleted file mode 100644 index 7a00420a00bb3a..00000000000000 --- a/playground/vue-sourcemap/SassWithImport.vue +++ /dev/null @@ -1,11 +0,0 @@ - - - diff --git a/playground/vue-sourcemap/Ts.vue b/playground/vue-sourcemap/Ts.vue deleted file mode 100644 index e0d96bb4725abd..00000000000000 --- a/playground/vue-sourcemap/Ts.vue +++ /dev/null @@ -1,11 +0,0 @@ - - - - - diff --git a/playground/vue-sourcemap/__tests__/__snapshots__/vue-sourcemap.spec.ts.snap b/playground/vue-sourcemap/__tests__/__snapshots__/vue-sourcemap.spec.ts.snap deleted file mode 100644 index d2600ee6edccce..00000000000000 --- a/playground/vue-sourcemap/__tests__/__snapshots__/vue-sourcemap.spec.ts.snap +++ /dev/null @@ -1,335 +0,0 @@ -// Vitest Snapshot v1 - -exports[`serve:vue-sourcemap > css > serve-css 1`] = ` -{ - "mappings": ";AAQA;EACE,UAAU;AACZ", - "sources": [ - "/root/Css.vue", - ], - "sourcesContent": [ - " - - - - - - - - -", - ], - "version": 3, -} -`; - -exports[`serve:vue-sourcemap > css module > serve-css-module 1`] = ` -{ - "mappings": ";AAcA;EACE,UAAU;AACZ", - "sources": [ - "/root/Css.vue", - ], - "sourcesContent": [ - " - - - - - - - - -", - ], - "version": 3, -} -`; - -exports[`serve:vue-sourcemap > css scoped > serve-css-scoped 1`] = ` -{ - "mappings": ";AAoBA;EACE,UAAU;AACZ", - "sources": [ - "/root/Css.vue", - ], - "sourcesContent": [ - " - - - - - - - - -", - ], - "version": 3, -} -`; - -exports[`serve:vue-sourcemap > js > serve-js 1`] = ` -{ - "mappings": "AAKA,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;;;;;;AAGP;AACd,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;;;;;;;;;;;wBARlB,oBAAiB,WAAd,MAAU", - "sources": [ - "/root/Js.vue", - ], - "sourcesContent": [ - " - - - - -", - ], - "version": 3, -} -`; - -exports[`serve:vue-sourcemap > less with additionalData > serve-less-with-additionalData 1`] = ` -{ - "mappings": "AAKA;EACE", - "sources": [ - "/root/Less.vue", - ], - "sourcesContent": [ - " - - -", - ], - "version": 3, -} -`; - -exports[`serve:vue-sourcemap > no script > serve-no-script 1`] = ` -{ - "mappings": ";;;wBACE,oBAAwB,WAArB,aAAiB", - "sourceRoot": "", - "sources": [ - "/root/NoScript.vue", - ], - "sourcesContent": [ - " -", - ], - "version": 3, -} -`; - -exports[`serve:vue-sourcemap > no template > serve-no-template 1`] = ` -{ - "mappings": "AACA,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;;;;;;AAGP;AACd,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;;;;;;;", - "sources": [ - "/root/NoTemplate.vue", - ], - "sourcesContent": [ - " - - -", - ], - "version": 3, -} -`; - -exports[`serve:vue-sourcemap > sass > serve-sass 1`] = ` -{ - "mappings": "AAKA;EACE", - "sources": [ - "/root/Sass.vue", - ], - "sourcesContent": [ - " - - -", - ], - "version": 3, -} -`; - -exports[`serve:vue-sourcemap > sass with import > serve-sass-with-import 1`] = ` -{ - "mappings": "AAAA;EACE;;ACOF;EACE", - "sources": [ - "/root/sassWithImportImported.sass", - "/root/SassWithImport.vue", - ], - "sourcesContent": [ - ".sass-with-import-imported - color: red -", - " - - -", - ], - "version": 3, -} -`; - -exports[`serve:vue-sourcemap > src imported > serve-src-imported 1`] = ` -{ - "mappings": "AAAA;EACE,UAAU;AACZ", - "sources": [ - "/root/src-import/src-import.css", - ], - "sourcesContent": [ - ".src-import { - color: red; -} -", - ], - "version": 3, -} -`; - -exports[`serve:vue-sourcemap > src imported sass > serve-src-imported-sass 1`] = ` -{ - "mappings": "AAAA;EACE;;ACCF;EACE", - "sources": [ - "/root/src-import/src-import-imported.sass", - "/root/src-import/src-import.sass", - ], - "sourcesContent": [ - ".src-import-sass-imported - color: red -", - "@import './src-import-imported' - -.src-import-sass - color: red -", - ], - "version": 3, -} -`; - -exports[`serve:vue-sourcemap > ts > serve-ts 1`] = ` -{ - "mappings": ";AAKA,QAAQ,IAAI,WAAW;;;;;AAIvB,YAAQ,IAAI,UAAU;;;;;;;;uBARpB,oBAAiB,WAAd,MAAU", - "sources": [ - "/root/Ts.vue", - ], - "sourcesContent": [ - " - - - - -", - ], - "version": 3, -} -`; diff --git a/playground/vue-sourcemap/__tests__/vue-sourcemap.spec.ts b/playground/vue-sourcemap/__tests__/vue-sourcemap.spec.ts deleted file mode 100644 index ee6473c6304e4e..00000000000000 --- a/playground/vue-sourcemap/__tests__/vue-sourcemap.spec.ts +++ /dev/null @@ -1,117 +0,0 @@ -import { URL } from 'node:url' -import { describe, expect, test } from 'vitest' -import { - extractSourcemap, - formatSourcemapForSnapshot, - isBuild, - isServe, - page, - serverLogs -} from '~utils' - -describe.runIf(isServe)('serve:vue-sourcemap', () => { - const getStyleTagContentIncluding = async (content: string) => { - const styles = await page.$$('style') - for (const style of styles) { - const text = await style.textContent() - if (text.includes(content)) { - return text - } - } - throw new Error('Style not found: ' + content) - } - - test('js', async () => { - const res = await page.request.get(new URL('./Js.vue', page.url()).href) - const js = await res.text() - const map = extractSourcemap(js) - expect(formatSourcemapForSnapshot(map)).toMatchSnapshot('serve-js') - }) - - test('ts', async () => { - const res = await page.request.get(new URL('./Ts.vue', page.url()).href) - const js = await res.text() - const map = extractSourcemap(js) - expect(formatSourcemapForSnapshot(map)).toMatchSnapshot('serve-ts') - }) - - test('css', async () => { - const css = await getStyleTagContentIncluding('.css ') - const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchSnapshot('serve-css') - }) - - test('css module', async () => { - const css = await getStyleTagContentIncluding('._css-module_') - const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchSnapshot('serve-css-module') - }) - - test('css scoped', async () => { - const css = await getStyleTagContentIncluding('.css-scoped[data-v-') - const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchSnapshot('serve-css-scoped') - }) - - test('sass', async () => { - const css = await getStyleTagContentIncluding('.sass ') - const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchSnapshot('serve-sass') - }) - - test('sass with import', async () => { - const css = await getStyleTagContentIncluding('.sass-with-import ') - const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchSnapshot( - 'serve-sass-with-import' - ) - }) - - test('less with additionalData', async () => { - const css = await getStyleTagContentIncluding('.less ') - const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchSnapshot( - 'serve-less-with-additionalData' - ) - }) - - test('src imported', async () => { - const css = await getStyleTagContentIncluding('.src-import[data-v-') - const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchSnapshot( - 'serve-src-imported' - ) - }) - - test('src imported sass', async () => { - const css = await getStyleTagContentIncluding('.src-import-sass[data-v-') - const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchSnapshot( - 'serve-src-imported-sass' - ) - }) - - test('no script', async () => { - const res = await page.request.get( - new URL('./NoScript.vue', page.url()).href - ) - const js = await res.text() - const map = extractSourcemap(js) - expect(formatSourcemapForSnapshot(map)).toMatchSnapshot('serve-no-script') - }) - - test('no template', async () => { - const res = await page.request.get( - new URL('./NoTemplate.vue', page.url()).href - ) - const js = await res.text() - const map = extractSourcemap(js) - expect(formatSourcemapForSnapshot(map)).toMatchSnapshot('serve-no-template') - }) -}) - -test.runIf(isBuild)('should not output sourcemap warning (#4939)', () => { - serverLogs.forEach((log) => { - expect(log).not.toMatch('Sourcemap is likely to be incorrect') - }) -}) diff --git a/playground/vue-sourcemap/index.html b/playground/vue-sourcemap/index.html deleted file mode 100644 index 57f325518a2c25..00000000000000 --- a/playground/vue-sourcemap/index.html +++ /dev/null @@ -1,7 +0,0 @@ -
- diff --git a/playground/vue-sourcemap/package.json b/playground/vue-sourcemap/package.json deleted file mode 100644 index a3074b079cd7cd..00000000000000 --- a/playground/vue-sourcemap/package.json +++ /dev/null @@ -1,20 +0,0 @@ -{ - "name": "test-vue-sourcemap", - "private": true, - "version": "0.0.0", - "scripts": { - "dev": "vite", - "build": "vite build", - "debug": "node --inspect-brk ../../packages/vite/bin/vite", - "preview": "vite preview" - }, - "devDependencies": { - "@vitejs/plugin-vue": "^4.0.0-alpha.0", - "less": "^4.1.3", - "postcss-nested": "^5.0.6", - "sass": "^1.56.1" - }, - "dependencies": { - "vue": "^3.2.45" - } -} diff --git a/playground/vue-sourcemap/postcss.config.js b/playground/vue-sourcemap/postcss.config.js deleted file mode 100644 index 9ea26b495d91b5..00000000000000 --- a/playground/vue-sourcemap/postcss.config.js +++ /dev/null @@ -1,3 +0,0 @@ -module.exports = { - plugins: [require('postcss-nested')] -} diff --git a/playground/vue-sourcemap/sassWithImportImported.sass b/playground/vue-sourcemap/sassWithImportImported.sass deleted file mode 100644 index 8092b37048cbdd..00000000000000 --- a/playground/vue-sourcemap/sassWithImportImported.sass +++ /dev/null @@ -1,2 +0,0 @@ -.sass-with-import-imported - color: red diff --git a/playground/vue-sourcemap/src-import/SrcImport.vue b/playground/vue-sourcemap/src-import/SrcImport.vue deleted file mode 100644 index 406c6a6b45382d..00000000000000 --- a/playground/vue-sourcemap/src-import/SrcImport.vue +++ /dev/null @@ -1,8 +0,0 @@ - - - - diff --git a/playground/vue-sourcemap/src-import/src-import-imported.sass b/playground/vue-sourcemap/src-import/src-import-imported.sass deleted file mode 100644 index 2ed87d933e58a6..00000000000000 --- a/playground/vue-sourcemap/src-import/src-import-imported.sass +++ /dev/null @@ -1,2 +0,0 @@ -.src-import-sass-imported - color: red diff --git a/playground/vue-sourcemap/src-import/src-import.css b/playground/vue-sourcemap/src-import/src-import.css deleted file mode 100644 index da61ff0fb6cb27..00000000000000 --- a/playground/vue-sourcemap/src-import/src-import.css +++ /dev/null @@ -1,3 +0,0 @@ -.src-import { - color: red; -} diff --git a/playground/vue-sourcemap/src-import/src-import.sass b/playground/vue-sourcemap/src-import/src-import.sass deleted file mode 100644 index c7e0314fda541c..00000000000000 --- a/playground/vue-sourcemap/src-import/src-import.sass +++ /dev/null @@ -1,4 +0,0 @@ -@import './src-import-imported' - -.src-import-sass - color: red diff --git a/playground/vue-sourcemap/vite.config.ts b/playground/vue-sourcemap/vite.config.ts deleted file mode 100644 index dbfa81dbeb1144..00000000000000 --- a/playground/vue-sourcemap/vite.config.ts +++ /dev/null @@ -1,17 +0,0 @@ -import vuePlugin from '@vitejs/plugin-vue' -import { defineConfig } from 'vite' - -export default defineConfig({ - css: { - devSourcemap: true, - preprocessorOptions: { - less: { - additionalData: '@color: red;' - } - } - }, - plugins: [vuePlugin()], - build: { - sourcemap: true - } -}) diff --git a/playground/vue/Assets.vue b/playground/vue/Assets.vue deleted file mode 100644 index 875ac1b243b393..00000000000000 --- a/playground/vue/Assets.vue +++ /dev/null @@ -1,42 +0,0 @@ - - - diff --git a/playground/vue/AsyncComponent.vue b/playground/vue/AsyncComponent.vue deleted file mode 100644 index 4e66630c4d2edd..00000000000000 --- a/playground/vue/AsyncComponent.vue +++ /dev/null @@ -1,15 +0,0 @@ - - - diff --git a/playground/vue/CssModules.vue b/playground/vue/CssModules.vue deleted file mode 100644 index f7897e2e57f652..00000000000000 --- a/playground/vue/CssModules.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - - - diff --git a/playground/vue/CustomBlock.vue b/playground/vue/CustomBlock.vue deleted file mode 100644 index 0a7b3901693154..00000000000000 --- a/playground/vue/CustomBlock.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - - - -en: - hello: 'hello,vite!' -ja: - hello: 'こんにちは、vite！' - diff --git a/playground/vue/CustomBlockPlugin.ts b/playground/vue/CustomBlockPlugin.ts deleted file mode 100644 index bfa3f2342881ca..00000000000000 --- a/playground/vue/CustomBlockPlugin.ts +++ /dev/null @@ -1,20 +0,0 @@ -import type { Plugin } from 'vite' - -export const vueI18nPlugin: Plugin = { - name: 'vue-i18n', - async transform(code, id) { - if (!/vue&type=i18n/.test(id)) { - return - } - if (/\.ya?ml$/.test(id)) { - const { load } = await import('js-yaml') - code = JSON.stringify(load(code.trim())) - } - return { - code: `export default Comp => { - Comp.i18n = ${code} - }`, - map: { mappings: '' } - } - } -} diff --git a/playground/vue/CustomElement.ce.vue b/playground/vue/CustomElement.ce.vue deleted file mode 100644 index 58d94650d1a74a..00000000000000 --- a/playground/vue/CustomElement.ce.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - - - diff --git a/playground/vue/Hmr.vue b/playground/vue/Hmr.vue deleted file mode 100644 index 5535467af3858f..00000000000000 --- a/playground/vue/Hmr.vue +++ /dev/null @@ -1,20 +0,0 @@ - - - - - diff --git a/playground/vue/HmrTsx.vue b/playground/vue/HmrTsx.vue deleted file mode 100644 index c1a2331da6a6be..00000000000000 --- a/playground/vue/HmrTsx.vue +++ /dev/null @@ -1,17 +0,0 @@ - - - - - diff --git a/playground/vue/Main.vue b/playground/vue/Main.vue deleted file mode 100644 index b91d50f9287a31..00000000000000 --- a/playground/vue/Main.vue +++ /dev/null @@ -1,58 +0,0 @@ - - - diff --git a/playground/vue/Node.vue b/playground/vue/Node.vue deleted file mode 100644 index 246442d29f522c..00000000000000 --- a/playground/vue/Node.vue +++ /dev/null @@ -1,3 +0,0 @@ - diff --git a/playground/vue/Null.vue b/playground/vue/Null.vue deleted file mode 100644 index edec53c4b13264..00000000000000 --- a/playground/vue/Null.vue +++ /dev/null @@ -1 +0,0 @@ - diff --git a/playground/vue/PreProcessors.vue b/playground/vue/PreProcessors.vue deleted file mode 100644 index c210448d332456..00000000000000 --- a/playground/vue/PreProcessors.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - - - - - - - diff --git a/playground/vue/ReactivityTransform.vue b/playground/vue/ReactivityTransform.vue deleted file mode 100644 index 0dc2b09343d641..00000000000000 --- a/playground/vue/ReactivityTransform.vue +++ /dev/null @@ -1,12 +0,0 @@ - - - diff --git a/playground/vue/ScanDep.vue b/playground/vue/ScanDep.vue deleted file mode 100644 index 17b398beab1cd2..00000000000000 --- a/playground/vue/ScanDep.vue +++ /dev/null @@ -1,8 +0,0 @@ - - - diff --git a/playground/vue/Slotted.vue b/playground/vue/Slotted.vue deleted file mode 100644 index fb25a9c5100215..00000000000000 --- a/playground/vue/Slotted.vue +++ /dev/null @@ -1,12 +0,0 @@ - - - diff --git a/playground/vue/Syntax.vue b/playground/vue/Syntax.vue deleted file mode 100644 index de100226922c55..00000000000000 --- a/playground/vue/Syntax.vue +++ /dev/null @@ -1,14 +0,0 @@ - - - diff --git a/playground/vue/TsImport.vue b/playground/vue/TsImport.vue deleted file mode 100644 index 7858c8cfa674d2..00000000000000 --- a/playground/vue/TsImport.vue +++ /dev/null @@ -1,10 +0,0 @@ - - - diff --git a/playground/vue/TsImportFile.ts b/playground/vue/TsImportFile.ts deleted file mode 100644 index 62761d5733b432..00000000000000 --- a/playground/vue/TsImportFile.ts +++ /dev/null @@ -1 +0,0 @@ -export const foo = 'success' diff --git a/playground/vue/Url.vue b/playground/vue/Url.vue deleted file mode 100644 index c65d1f418cfd7d..00000000000000 --- a/playground/vue/Url.vue +++ /dev/null @@ -1,10 +0,0 @@ - - - diff --git a/playground/vue/__tests__/vue.spec.ts b/playground/vue/__tests__/vue.spec.ts deleted file mode 100644 index feaeb42b8f7a6c..00000000000000 --- a/playground/vue/__tests__/vue.spec.ts +++ /dev/null @@ -1,281 +0,0 @@ -import { describe, expect, test } from 'vitest' -import { - browserLogs, - editFile, - getBg, - getColor, - isBuild, - page, - serverLogs, - untilUpdated -} from '~utils' - -test('should render', async () => { - expect(await page.textContent('h1')).toMatch('Vue SFCs') -}) - -test('should update', async () => { - expect(await page.textContent('.hmr-inc')).toMatch('count is 0') - await page.click('.hmr-inc') - expect(await page.textContent('.hmr-inc')).toMatch('count is 1') -}) - -test('template/script latest syntax support', async () => { - expect(await page.textContent('.syntax')).toBe('baz') -}) - -test('import ts with .js extension with lang="ts"', async () => { - expect(await page.textContent('.ts-import')).toBe('success') - expect(await page.textContent('.ts-import2')).toBe('success') -}) - -test('should remove comments in prod', async () => { - expect(await page.innerHTML('.comments')).toBe(isBuild ? `` : ``) -}) - -test(':slotted', async () => { - expect(await getColor('.slotted')).toBe('red') -}) - -describe('dep scan', () => { - test('scan deps from - diff --git a/playground/vue/package.json b/playground/vue/package.json deleted file mode 100644 index c5c9346c512944..00000000000000 --- a/playground/vue/package.json +++ /dev/null @@ -1,23 +0,0 @@ -{ - "name": "test-vue", - "private": true, - "version": "0.0.0", - "scripts": { - "dev": "vite", - "build": "vite build", - "debug": "node --inspect-brk ../../packages/vite/bin/vite", - "preview": "vite preview" - }, - "dependencies": { - "lodash-es": "^4.17.21", - "vue": "^3.2.45" - }, - "devDependencies": { - "@vitejs/plugin-vue": "^4.0.0-alpha.0", - "js-yaml": "^4.1.0", - "less": "^4.1.3", - "pug": "^3.0.2", - "sass": "^1.56.1", - "stylus": "^0.59.0" - } -} diff --git a/playground/vue/public/favicon.ico b/playground/vue/public/favicon.ico deleted file mode 100644 index df36fcfb72584e..00000000000000 Binary files a/playground/vue/public/favicon.ico and /dev/null differ diff --git a/playground/vue/public/icon.png b/playground/vue/public/icon.png deleted file mode 100644 index 4388bfdca3d4d7..00000000000000 Binary files a/playground/vue/public/icon.png and /dev/null differ diff --git a/playground/vue/setup-import-template/SetupImportTemplate.vue b/playground/vue/setup-import-template/SetupImportTemplate.vue deleted file mode 100644 index d7fb119e3cfdc0..00000000000000 --- a/playground/vue/setup-import-template/SetupImportTemplate.vue +++ /dev/null @@ -1,5 +0,0 @@ - - diff --git a/playground/vue/setup-import-template/template.html b/playground/vue/setup-import-template/template.html deleted file mode 100644 index 414069f2e9e929..00000000000000 --- a/playground/vue/setup-import-template/template.html +++ /dev/null @@ -1,2 +0,0 @@ -

Setup Import Template

- diff --git a/playground/vue/src-import/SrcImport.vue b/playground/vue/src-import/SrcImport.vue deleted file mode 100644 index d70e1f48a84331..00000000000000 --- a/playground/vue/src-import/SrcImport.vue +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/playground/vue/src-import/css.module.css b/playground/vue/src-import/css.module.css deleted file mode 100644 index 09b5c09fb637e2..00000000000000 --- a/playground/vue/src-import/css.module.css +++ /dev/null @@ -1,7 +0,0 @@ -.one { - background: yellow; -} - -.two { - border: solid 1px red; -} diff --git a/playground/vue/src-import/script.ts b/playground/vue/src-import/script.ts deleted file mode 100644 index d20c098a7af289..00000000000000 --- a/playground/vue/src-import/script.ts +++ /dev/null @@ -1,19 +0,0 @@ -import { defineComponent } from 'vue' -import SrcImportStyle from './srcImportStyle.vue' -import SrcImportStyle2 from './srcImportStyle2.vue' -import SrcImportModuleStyle from './srcImportModuleStyle.vue' -import SrcImportModuleStyle2 from './srcImportModuleStyle2.vue' - -export default defineComponent({ - components: { - SrcImportStyle, - SrcImportStyle2, - SrcImportModuleStyle, - SrcImportModuleStyle2 - }, - setup() { - return { - msg: 'hello from script src!' - } - } -}) diff --git a/playground/vue/src-import/srcImportModuleStyle.vue b/playground/vue/src-import/srcImportModuleStyle.vue deleted file mode 100644 index f1e85abb6d2b12..00000000000000 --- a/playground/vue/src-import/srcImportModuleStyle.vue +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/playground/vue/src-import/srcImportStyle2.vue b/playground/vue/src-import/srcImportStyle2.vue deleted file mode 100644 index 1e0f327413103e..00000000000000 --- a/playground/vue/src-import/srcImportStyle2.vue +++ /dev/null @@ -1,4 +0,0 @@ - - diff --git a/playground/vue/src-import/style.css b/playground/vue/src-import/style.css deleted file mode 100644 index 49ab2d93176f4f..00000000000000 --- a/playground/vue/src-import/style.css +++ /dev/null @@ -1,3 +0,0 @@ -.src-imports-style { - color: tan; -} diff --git a/playground/vue/src-import/style2.css b/playground/vue/src-import/style2.css deleted file mode 100644 index 8c93cb983cc09d..00000000000000 --- a/playground/vue/src-import/style2.css +++ /dev/null @@ -1,3 +0,0 @@ -.src-imports-script { - color: #0088ff; -} diff --git a/playground/vue/src-import/template.html b/playground/vue/src-import/template.html deleted file mode 100644 index af94a480e7e357..00000000000000 --- a/playground/vue/src-import/template.html +++ /dev/null @@ -1,7 +0,0 @@ -

SFC Src Imports

-
{{ msg }}
-
This should be tan
- - - - diff --git a/playground/vue/tsconfig.json b/playground/vue/tsconfig.json deleted file mode 100644 index bdc0eedc2244af..00000000000000 --- a/playground/vue/tsconfig.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "compilerOptions": { - // esbuild transpile should ignore this - "target": "ES5" - }, - "include": ["."] -} diff --git a/playground/vue/vite-env.d.ts b/playground/vue/vite-env.d.ts deleted file mode 100644 index 11f02fe2a0061d..00000000000000 --- a/playground/vue/vite-env.d.ts +++ /dev/null @@ -1 +0,0 @@ -/// diff --git a/playground/vue/vite.config.ts b/playground/vue/vite.config.ts deleted file mode 100644 index c1561ce2c2bd47..00000000000000 --- a/playground/vue/vite.config.ts +++ /dev/null @@ -1,38 +0,0 @@ -import { defineConfig, splitVendorChunkPlugin } from 'vite' -import vuePlugin from '@vitejs/plugin-vue' -import { vueI18nPlugin } from './CustomBlockPlugin' - -export default defineConfig({ - resolve: { - alias: { - '/@': __dirname, - '@': __dirname - } - }, - plugins: [ - vuePlugin({ - reactivityTransform: true - }), - splitVendorChunkPlugin(), - vueI18nPlugin - ], - build: { - // to make tests faster - minify: false, - rollupOptions: { - output: { - // Test splitVendorChunkPlugin composition - manualChunks(id) { - if (id.includes('src-import')) { - return 'src-import' - } - } - } - } - }, - css: { - modules: { - localsConvention: 'camelCaseOnly' - } - } -}) diff --git a/playground/vue/worker.vue b/playground/vue/worker.vue deleted file mode 100644 index c5369fda742348..00000000000000 --- a/playground/vue/worker.vue +++ /dev/null @@ -1,17 +0,0 @@ - - - diff --git a/playground/vue/workerTest.js b/playground/vue/workerTest.js deleted file mode 100644 index fcde5e19b30677..00000000000000 --- a/playground/vue/workerTest.js +++ /dev/null @@ -1 +0,0 @@ -self.postMessage('worker load!')