Skip to content

Commit

Permalink
feat(create-vite): add react-swc templates (#11280)
Browse files Browse the repository at this point in the history
  • Loading branch information
bluwy authored Dec 9, 2022
1 parent 2a558ef commit 348146f
Show file tree
Hide file tree
Showing 3 changed files with 43 additions and 2 deletions.
2 changes: 1 addition & 1 deletion docs/guide/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -77,7 +77,7 @@ yarn create vite my-vue-app --template vue
pnpm create vite my-vue-app --template vue
```

See [create-vite](https://github.com/vitejs/vite/tree/main/packages/create-vite) for more details on each supported template: `vanilla`, `vanilla-ts`, `vue`, `vue-ts`, `react`, `react-ts`, `preact`, `preact-ts`, `lit`, `lit-ts`, `svelte`, `svelte-ts`.
See [create-vite](https://github.com/vitejs/vite/tree/main/packages/create-vite) for more details on each supported template: `vanilla`, `vanilla-ts`, `vue`, `vue-ts`, `react`, `react-ts`, `react-swc`, `react-swc-ts`, `preact`, `preact-ts`, `lit`, `lit-ts`, `svelte`, `svelte-ts`.

## Community Templates

Expand Down
2 changes: 2 additions & 0 deletions packages/create-vite/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,8 @@ Currently supported template presets include:
- `vue-ts`
- `react`
- `react-ts`
- `react-swc`
- `react-swc-ts`
- `preact`
- `preact-ts`
- `lit`
Expand Down
41 changes: 40 additions & 1 deletion packages/create-vite/src/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -100,6 +100,16 @@ const FRAMEWORKS: Framework[] = [
display: 'TypeScript',
color: blue,
},
{
name: 'react-swc',
display: 'JavaScript + SWC',
color: yellow,
},
{
name: 'react-ts-swc',
display: 'TypeScript + SWC',
color: blue,
},
],
},
{
Expand Down Expand Up @@ -292,7 +302,12 @@ async function init() {
}

// determine template
const template: string = variant || framework?.name || argTemplate
let template: string = variant || framework?.name || argTemplate
let isReactSwc = false
if (template.endsWith('-swc')) {
isReactSwc = true
template = template.slice(0, -4)
}

const pkgInfo = pkgFromUserAgent(process.env.npm_config_user_agent)
const pkgManager = pkgInfo ? pkgInfo.name : 'npm'
Expand Down Expand Up @@ -357,6 +372,10 @@ async function init() {

write('package.json', JSON.stringify(pkg, null, 2))

if (isReactSwc) {
setupReactSwc(root, template.endsWith('-ts'))
}

console.log(`\nDone. Now run:\n`)
if (root !== cwd) {
console.log(` cd ${path.relative(cwd, root)}`)
Expand Down Expand Up @@ -438,6 +457,26 @@ function pkgFromUserAgent(userAgent: string | undefined) {
}
}

function setupReactSwc(root: string, isTs: boolean) {
editFile(path.resolve(root, 'package.json'), (content) => {
return content.replace(
/"@vitejs\/plugin-react": ".+?"/,
`"@vitejs/plugin-react-swc": "^3.0.0"`,
)
})
editFile(
path.resolve(root, `vite.config.${isTs ? 'ts' : 'js'}`),
(content) => {
return content.replace('@vitejs/plugin-react', '@vitejs/plugin-react-swc')
},
)
}

function editFile(file: string, callback: (content: string) => string) {
const content = fs.readFileSync(file, 'utf-8')
fs.writeFileSync(file, callback(content), 'utf-8')
}

init().catch((e) => {
console.error(e)
})

0 comments on commit 348146f

Please sign in to comment.