vite中无法使用require和@无法使用的问题

最新推荐文章于 2024-11-05 20:44:46 发布

SwaryLA

最新推荐文章于 2024-11-05 20:44:46 发布

阅读量1.3k

点赞数

CC 4.0 BY-SA版权

分类专栏： vue 文章标签：前端 javascript vue.js

本文链接：https://blog.csdn.net/weixin_48927323/article/details/126179375

vue 专栏收录该内容

26 篇文章

订阅专栏

这篇博客介绍了如何在Vite项目中安装和配置`vite-plugin-require-transform`插件，以处理TypeScript和Vue文件。首先，通过yarn或npm安装插件，然后在Vite的配置文件中引入并设置fileRegex匹配.ts和.vue文件。此外，还展示了如何在Vite中配置路径别名 '@' 指向src目录。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1，安装插件

//yarn 安装
yarn add -D vite-plugin-require-transform
//npm 安装
npm i vite-plugin-require-transform --S

2.在vite中配置一下即可

import { defineConfig } from 'vite'
import requireTransform from 'vite-plugin-require-transform';
 
export default defineConfig({
  plugins: [
    requireTransform({
      fileRegex: /.ts$|.vue$/
    }),
  ],
});

vite里使用@需要在config里配置一下

import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
const path = require('path');

export default defineConfig({
  plugins: [vue()],
  define: {
    'process.env': {},
  },
  resolve: {
    // 配置路径别名
    alias: {
      '@': path.resolve(__dirname, './src'),
    },
  },
});