a vite plugin supports the use of require syntax.
npm install vite-plugin-require-supportA vite plugin supports the use of require syntax in vite.
``
- const foo = require('bar')
+ import hash_bar from 'bar'
+ const foo = hash_bar
`
npm install -D vite-plugin-require-support
`
// vite.config.(t|j)s
import { defineConfig } from 'vite';
import requireSupport from 'vite-plugin-require-support';
export default defineConfig({
plugins: [
requireSupport({
filters: /.ts$|.js$|.tsx$|.vue$/
})
],
});
`
`
- const foo = require('./a/b/foo.js')
+ import Xs02j_foo from './a/b/foo.js'
+ const foo = Xs02j_foo
#### requirePath
- './a/b/foo.js' regard as requirePath
- requirePath = path + module ID + suffix eg: ./a/b/ + foo + js
- requirePath have two shapes: string literal and template literal
#### moduleVariable
- Xs02j_foo regard as moduleVariable
- moduleVariable = hash + _ + originVariable eg: Xs02j + _ + foo
- requirePath = path + module ID + suffix
- when there are multiple module requests with similar appearance, the design is more flexible to distinguish different module request paths.
- comparison algorithm priority of module request path: module ID > suffix > path
`
const img1 = require('./a/b/foo.png')
const img2 = require('./a/s/foo.png')
const img2 = require('./a/b/foo.jpg')
- requirePath have two shapes: string literal and template literal
`
const foo = require('foo') // string literal
const a = 'bar'
const zoo = require() // template literal`
- moduleVariable = hash + _ + originVariable
- because variable moduleVariable is generated internally by the plugin, in order to prevent the generated variable from conflicting with the variable declared by the user, I add hash to variable.( or Symbol?)
- export mode transform
`
// case1
- const foo = require('foo')
- const bar = require('foo').fn
+ import SDWS_foo, { fn as SDC_foo_fn } from 'foo'
+ const foo = SDWS_foo
+ const bar = SDC_foo_fn
// case2
- const a = require('foo').a
- const b = require('foo').b
+ import { a as SDC_foo_a, b as SKDsk_foo_b } from 'foo'
+ const a = SDC_foo_a
+ const b = SKDsk_foo_b
`
> reference vue specification (Angular)
- feat Add new featuresfix
- Fix the problem/BUGstyle
- The code style is related and does not affect the running resultperf
- Optimization/performance improvementrefactor
- Refactorrevert
- Undo edittest
- Test relateddocs
- Documentation/noteschore
- Dependency update/scaffolding configuration modification etc.workflow
- Workflow improvementsci
- Continuous integrationtypes
- Type definition file changeswip` In development
-