vite 我的项目不反对 require 语法问题解决 require is not defined
Vite 默认应用 es6 规范的 import 的导入形式,不反对 require 引入。默认有 Vite 本人的引入形式 https://vitejs.cn/guide/asset…
但在在日常应用 Vue3+Ts+Vite 构建我的项目中, 局部比拟旧的 三方插件中 默认应用的是 require 引入(webpack 构建能够应用), 会呈现 require 办法报错的兼容性问题 require is not defined。
1. require 和 import 导入区别
年份 | 出处 | 应用 | |
---|---|---|---|
require/exports | 2009 | CommonJS | const lodash = require(‘lodash’); |
import/export | 2015 | ECMAScript2015(ES6) | import lodash from ‘lodash’; |
2. 解决办法
Vite 仓库社区生态 https://github.com/vitejs/awe… 中有一个
插件 vite-plugin-require-transform。插件主动转换 import xxx from ”; 办法 引入
\
装置
yarn add -D vite-plugin-require-transform
或者
npm i vite-plugin-require-transform --save-dev
应用
// vite.config.ts 配置
import requireTransform from 'vite-plugin-require-transform';
plugins: [
// ...
requireTransform({
fileRegex:/.ts$|.tsx$|.vue$/
// fileRegex:/.js$|.jsx$|.vue$/
}),
]
增加之后 npm run build 打包 npm run preview 预览无异样。