Skip to content

Commit a3c6688

Browse files
committed
up
1 parent c76377c commit a3c6688

File tree

1 file changed

+98
-82
lines changed

1 file changed

+98
-82
lines changed

website/docs/en/config/lib/shims.mdx

Lines changed: 98 additions & 82 deletions
Original file line numberDiff line numberDiff line change
@@ -5,17 +5,17 @@
55
```ts
66
type Shims = {
77
cjs?:
8-
| boolean
9-
| {
10-
'import.meta.url'?: boolean;
11-
};
8+
| boolean
9+
| {
10+
'import.meta.url'?: boolean;
11+
};
1212
esm?:
13-
| boolean
14-
| {
15-
__filename?: boolean;
16-
__dirname?: boolean;
17-
require?: boolean;
18-
};
13+
| boolean
14+
| {
15+
__filename?: boolean;
16+
__dirname?: boolean;
17+
require?: boolean;
18+
};
1919
};
2020
```
2121

@@ -50,24 +50,31 @@ Options:
5050

5151
- `true`: when `format` is `cjs`, the `import.meta.url` in source code will be replaced with the URL of the current module.
5252

53-
For example, given the following source code:
54-
55-
```js
56-
import { readFileSync } from 'fs';
57-
const buffer = readFileSync(new URL('./data.proto', import.meta.url));
58-
```
59-
60-
the CJS output will be transformed to:
61-
62-
```js
63-
const { readFileSync } = require('fs');
64-
const buffer = readFileSync(new URL('./data.proto', /*#__PURE__*/ (function () {
65-
return typeof document === 'undefined'
66-
? new (module.require('url'.replace('', '')).URL)('file:' + __filename).href
67-
: (document.currentScript && document.currentScript.src) ||
68-
new URL('main.js', document.baseURI).href;
69-
})()));
70-
```
53+
For example, given the following source code:
54+
55+
```js
56+
import { readFileSync } from 'fs';
57+
const buffer = readFileSync(new URL('./data.proto', import.meta.url));
58+
```
59+
60+
the CJS output will be transformed to:
61+
62+
```js
63+
const { readFileSync } = require('fs');
64+
const buffer = readFileSync(
65+
new URL(
66+
'./data.proto',
67+
/*#__PURE__*/ (function () {
68+
return typeof document === 'undefined'
69+
? new (module.require('url'.replace('', '')).URL)(
70+
'file:' + __filename,
71+
).href
72+
: (document.currentScript && document.currentScript.src) ||
73+
new URL('main.js', document.baseURI).href;
74+
})(),
75+
),
76+
);
77+
```
7178
7279
- `false`: the `import.meta.url` will be leave as is, which will cause a runtime error when running the output.
7380
@@ -77,52 +84,58 @@ Options:
7784
- set to `false` to disable all shims for ESM output.
7885
- set the fields to `true` to enable the corresponding shims for ESM output.
7986
80-
### shims.esm.__filename
87+
### shims.esm.\_\_filename
8188
8289
- **Default:** `false`
8390
8491
Options:
8592
8693
- `true`: when `format` is `esm`, the `__filename` in source code will be replaced with the filename of the current module.
8794
88-
For example, given the following source code:
95+
For example, given the following source code:
8996
90-
```js
91-
console.log(__filename);
92-
```
97+
```js
98+
console.log(__filename);
99+
```
93100
94-
the ESM output will be transformed to:
101+
the ESM output will be transformed to:
102+
103+
```js
104+
import { fileURLToPath as __webpack_fileURLToPath__ } from 'url';
105+
import { dirname as __webpack_dirname__ } from 'path';
106+
var src_dirname = __webpack_dirname__(
107+
__webpack_fileURLToPath__(import.meta.url),
108+
);
109+
var src_filename = __webpack_fileURLToPath__(import.meta.url);
110+
console.log(src_filename);
111+
```
95112
96-
```js
97-
import { fileURLToPath as __webpack_fileURLToPath__ } from "url";
98-
import { dirname as __webpack_dirname__ } from "path";
99-
var src_dirname = __webpack_dirname__(__webpack_fileURLToPath__(import.meta.url));
100-
var src_filename = __webpack_fileURLToPath__(import.meta.url);
101-
console.log(src_filename);
102-
```
103113
- `false`: the `__filename` will be leave as is, which will cause a runtime error when running the output.
104114
105-
### shims.esm.__dirname
115+
### shims.esm.\_\_dirname
106116
107117
- **Default:** `false`
108118
109119
Options:
120+
110121
- `true`: when `format` is `esm`, the `__dirname` in source code will be replaced with the directory name of the current module.
111122
112-
For example, given the following source code:
123+
For example, given the following source code:
113124
114-
```js
115-
console.log(__dirname);
116-
```
125+
```js
126+
console.log(__dirname);
127+
```
117128
118-
the ESM output will be transformed to:
129+
the ESM output will be transformed to:
119130
120-
```js
121-
import { fileURLToPath as __webpack_fileURLToPath__ } from "url";
122-
import { dirname as __webpack_dirname__ } from "path";
123-
var src_dirname = __webpack_dirname__(__webpack_fileURLToPath__(import.meta.url));
124-
console.log(src_dirname);
125-
```
131+
```js
132+
import { fileURLToPath as __webpack_fileURLToPath__ } from 'url';
133+
import { dirname as __webpack_dirname__ } from 'path';
134+
var src_dirname = __webpack_dirname__(
135+
__webpack_fileURLToPath__(import.meta.url),
136+
);
137+
console.log(src_dirname);
138+
```
126139
127140
- `false`: the `__dirname` will be leave as is, which will cause a runtime error when running the output.
128141
@@ -131,34 +144,37 @@ Options:
131144
- **Default:** `false`
132145
133146
Options:
134-
- `true`: when `format` is `esm`, the `require` in source code will be replaced with the directory name of the current module.
135-
136-
For example, given the following source code:
137-
138-
```js
139-
const someModule = require('./someModule');
140-
141-
// dynamic require
142-
const dynamicRequiredModule = require(SOME_VALUE_IN_RUNTIME);
143-
// require.resolve
144-
const someModulePath = require.resolve('./someModule');
145-
// use require as a expression
146-
const lazyFn = (module, requireFn) => {};
147-
lazyFn('./other.js', require);
148-
```
149-
150-
the ESM output will be transformed to:
151-
152-
```js
153-
import __rslib_shim_module__ from 'module';
154-
const require = /*#__PURE__*/ __rslib_shim_module__.createRequire(import.meta.url);
155-
// dynamic require
156-
require(SOME_VALUE_IN_RUNTIME);
157-
// require.resolve
158-
require.resolve('./someModule');
159-
// use require as a expression
160-
const lazyFn = (module, requireFn)=>{};
161-
lazyFn('./other.js', require);
162-
```
147+
148+
- `true`: when `format` is `esm`, there will be a `require` that created by `createRequire` at the beginning of the output which can be accessed in source code like the global `require` like CommonJS.
149+
150+
For example, given the following source code:
151+
152+
```js
153+
const someModule = require('./someModule');
154+
155+
// dynamic require
156+
const dynamicRequiredModule = require(SOME_VALUE_IN_RUNTIME);
157+
// require.resolve
158+
const someModulePath = require.resolve('./someModule');
159+
// use require as a expression
160+
const lazyFn = (module, requireFn) => {};
161+
lazyFn('./other.js', require);
162+
```
163+
164+
the ESM output will be transformed to:
165+
166+
```js
167+
import __rslib_shim_module__ from 'module';
168+
const require = /*#__PURE__*/ __rslib_shim_module__.createRequire(
169+
import.meta.url,
170+
);
171+
// dynamic require
172+
require(SOME_VALUE_IN_RUNTIME);
173+
// require.resolve
174+
require.resolve('./someModule');
175+
// use require as a expression
176+
const lazyFn = (module, requireFn) => {};
177+
lazyFn('./other.js', require);
178+
```
163179
164180
- `false`: the `require` will be leave as is, which will cause a runtime error when running the output.

0 commit comments

Comments
 (0)