vite.config.js 同时使用javascripy 和 typescripy
时间: 2023-10-14 17:21:33 浏览: 55
Vite 支持同时使用 JavaScript 和 TypeScript。只需要将文件分别放在 `src` 目录下的 `js` 和 `ts` 子目录中,然后在 `vite.config.js` 中配置对应的插件即可。
示例:
```js
import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import { resolve } from 'path';
export default defineConfig({
plugins: [vue()],
resolve: {
alias: {
'@': resolve(__dirname, 'src'),
},
},
server: {
port: 3000,
},
build: {
target: 'es2015',
outDir: 'dist',
assetsDir: 'assets',
sourcemap: true,
},
});
```
```json
// package.json
{
"scripts": {
"dev": "vite",
"build": "vite build"
}
}
```
项目结构:
```
├── src
│ ├── js
│ │ ├── main.js
│ │ └── ...
│ ├── ts
│ │ ├── main.ts
│ │ └── ...
│ └── index.html
├── vite.config.js
└── package.json
```
在 `main.js` 中引入 `main.ts`:
```js
// main.js
import { createApp } from 'vue';
import App from './App.vue';
import { init } from './ts/main';
const app = createApp(App);
// TypeScript 代码
init();
app.mount('#app');
```
```ts
// main.ts
export function init(): void {
console.log('TypeScript 代码');
}
```
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)