Skip to content

Commit bc90e03

Browse files
author
Jannik | Kuqs
committed
feat: vite support
1 parent 8b5c5ed commit bc90e03

19 files changed

+6408
-9777
lines changed

.browserslistrc

Lines changed: 0 additions & 3 deletions
This file was deleted.

.eslintrc.js

Lines changed: 0 additions & 18 deletions
This file was deleted.

.gitignore

Lines changed: 16 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,26 @@
1-
.DS_Store
2-
node_modules
3-
/dist
4-
5-
6-
# local env files
7-
.env.local
8-
.env.*.local
9-
10-
# Log files
1+
# Logs
2+
logs
3+
*.log
114
npm-debug.log*
125
yarn-debug.log*
136
yarn-error.log*
147
pnpm-debug.log*
8+
lerna-debug.log*
9+
10+
node_modules
11+
.DS_Store
12+
dist
13+
dist-ssr
14+
coverage
15+
*.local
16+
17+
/cypress/videos/
18+
/cypress/screenshots/
1519

1620
# Editor directories and files
21+
.vscode/*
22+
!.vscode/extensions.json
1723
.idea
18-
.vscode
1924
*.suo
2025
*.ntvs*
2126
*.njsproj

README.md

Lines changed: 39 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,46 @@
1-
# mdx-vue3
1+
# Vue 3 (Vite) + Typescript + MDX 2
22

3-
## Project setup
4-
```
5-
yarn install
6-
```
3+
This template should help get you started developing with Vue 3 in Vite and the MDX 2 integration.
74

8-
### Compiles and hot-reloads for development
9-
```
10-
yarn serve
11-
```
5+
![](https://i.imgur.com/lL9K9xj.png)
126

13-
### Compiles and minifies for production
14-
```
15-
yarn build
16-
```
7+
This project uses the 'Gfm' remark plugin. Others can be installed under `vite.config.ts`.
8+
9+
List of [Remark plugins](https://github.com/remarkjs/remark/blob/main/doc/plugins.md).
10+
11+
## Recommended IDE Setup
12+
13+
[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).
14+
15+
## Type Support for `.vue` Imports in TS
1716

18-
### Lints and fixes files
17+
TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin) to make the TypeScript language service aware of `.vue` types.
18+
19+
If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a [Take Over Mode](https://github.com/johnsoncodehk/volar/discussions/471#discussioncomment-1361669) that is more performant. You can enable it by the following steps:
20+
21+
1. Disable the built-in TypeScript Extension
22+
1) Run `Extensions: Show Built-in Extensions` from VSCode's command palette
23+
2) Find `TypeScript and JavaScript Language Features`, right click and select `Disable (Workspace)`
24+
2. Reload the VSCode window by running `Developer: Reload Window` from the command palette.
25+
26+
## Customize configuration
27+
28+
See [Vite Configuration Reference](https://vitejs.dev/config/).
29+
30+
## Project Setup
31+
32+
```sh
33+
npm install
1934
```
20-
yarn lint
35+
36+
### Compile and Hot-Reload for Development
37+
38+
```sh
39+
npm run dev
2140
```
2241

23-
### Customize configuration
24-
See [Configuration Reference](https://cli.vuejs.org/config/).
42+
### Type-Check, Compile and Minify for Production
43+
44+
```sh
45+
npm run build
46+
```

babel.config.js

Lines changed: 0 additions & 8 deletions
This file was deleted.

babel.config.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
module.exports = {
2+
plugins: ["@vue/babel-plugin-jsx"]
3+
}

env.d.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
/// <reference types="vite/client" />
2+
3+
declare module '*.vue' {
4+
import { DefineComponent } from 'vue'
5+
// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
6+
const component: DefineComponent<{}, {}, any>
7+
export default component
8+
}

index.html

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<link rel="icon" href="/favicon.ico">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<title>Vite App</title>
8+
</head>
9+
<body>
10+
<div id="app"></div>
11+
<script type="module" src="/src/main.ts"></script>
12+
</body>
13+
</html>

0 commit comments

Comments
 (0)