Skip to content
This repository was archived by the owner on Sep 11, 2025. It is now read-only.

Commit 2eb7cc2

Browse files
yunbookfyunbookf
committed
v2.0.0-dev publish.
1 parent 74f14e7 commit 2eb7cc2

File tree

7 files changed

+398
-91
lines changed

7 files changed

+398
-91
lines changed

‎README.md‎

Lines changed: 51 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -13,15 +13,15 @@ Simple browser module loader.
1313

1414
## Languages
1515

16-
[简体中文](doc/README.zh-CN.md) | [繁體中文](doc/README.zh-TW.md)
16+
[简体中文](doc/README.zh-cn.md) | [繁體中文](doc/README.zh-tw.md)
1717

1818
## Features
1919

20+
- [x] Supports running code in memory.
2021
- [x] The configuration is simple and lightweight.
2122
- [x] No intrusion and does not affect the script label.
2223
- [x] Support the CommonJS / ES6 Module format.
23-
- [x] The fetch function is automatically supported without additional loading.
24-
- [x] Supports running code in memory.
24+
- [x] The fetch function is automatically supported without additional loading.
2525

2626
## Installation
2727

@@ -43,58 +43,68 @@ $ npm i @litert/loader@dev --save
4343

4444
### CDN (recommend)
4545

46-
Recommended: https://cdn.jsdelivr.net/npm/@litert/loader@0.1.1/dist/index.min.js, which will reflect the latest version as soon as it is published to npm. You can also browse the source of the npm package at https://cdn.jsdelivr.net/npm/@litert/loader/.
46+
Recommended: https://cdn.jsdelivr.net/npm/@litert/loader@x.x.x/dist/index.min.js, of course x.x.x is just an example and needs to be changed to the official version number, you can also find it here https://cdn.jsdelivr.net/npm/@litert/loader/.
4747

48-
Also available on [unpkg](https://unpkg.com/@litert/[email protected]/dist/index.min.js).
49-
50-
For example:
51-
52-
```html
53-
<script src="https://cdn.jsdelivr.net/npm/@litert/[email protected]/dist/index.min.js"></script>
54-
```
48+
Also available on [unpkg](https://unpkg.com/@litert/[email protected]/dist/index.min.js).
5549

5650
## Usage
5751

5852
Here's a general how to use it:
5953

6054
```html
61-
<script src="https://cdn.jsdelivr.net/npm/@litert/loader@0.1.1/dist/index.min.js"></script>
55+
<script src="https://cdn.jsdelivr.net/npm/@litert/loader@x.x.x/dist/index.min.js"></script>
6256
```
6357

64-
```javascript
65-
// Adding a map does not require a "js" extension.
66-
loader.setPaths({
67-
"module": "https://xxx/xxx/index",
68-
"module2": "../abc/in"
69-
});
70-
loader.addPath("module3", "./en");
71-
// You can append strings after a file, for example, to prevent caching.
72-
loader.setAfter("?" + Math.random());
58+
```typescript
7359
// All actions are written in the "ready" callback.
7460
loader.ready(function() {
75-
loader.require(["../dist/tmodule", "module2"], function(t1, t2) {
76-
// Do something, you can also not write callbacks.
77-
});
61+
let files: Record<string, Blob | string> = { ... };
62+
let executedFiles: Record<string, any> = {};
63+
let tmodule: any, module2: any;
64+
[tmodule, module2] = loader.require(['../dist/tmodule', './module2'], files, executedFiles);
65+
});
66+
```
7867

79-
// --- Load by memory ---
80-
var [rtn] = await loader.requireMemory("main", {
81-
"/main.js": `var sub = require("./sub");
82-
function getData(key) {
83-
return key + ", end.";
84-
}
85-
exports.getData = getData;
86-
87-
function getSubStr() {
88-
return sub.str;
89-
}
90-
exports.getSubStr = getSubStr;`,
91-
"/sub.js": `exports.str = "hehe";`
92-
});
93-
console.log(main.getData("rand: " + Math.random()));
94-
console.log(main.getSubStr());
68+
You can use the fetchFiles method to load network files into memory.
69+
70+
```typescript
71+
let files: Record<string, Blob | string> = await loader.fetchFiles([
72+
'../dist/tmodule.js',
73+
'./module2.js',
74+
'https://cdn.jsdelivr.net/npm/[email protected]/seedrandom.min.js'
75+
]);
76+
```
77+
78+
Use sniffFiles to load network files into the memory, and sniff the inclusion relationship in the file, such as js import, require, etc., CSS url, etc.
79+
80+
```typescript
81+
let files: Record<string, Blob | string> = {};
82+
await loader.sniffFiles([
83+
'https://cdn.jsdelivr.net/npm/@juggle/[email protected]/lib/exports/resize-observer.js'
84+
], {
85+
'files': files
9586
});
9687
```
9788

89+
Using the map option, you can specify the alias of the library, the alias of the import command is also based on this.
90+
91+
```typescript
92+
let executedFiles: Record<string, any> = {};
93+
let files: Record<string, Blob | string> = {};
94+
if (!Object.keys(files).includes('https://cdn.jsdelivr.net/npm/[email protected]/seedrandom.min.js')) {
95+
await loader.fetchFiles([
96+
'https://cdn.jsdelivr.net/npm/[email protected]/seedrandom.min.js'
97+
], {
98+
'files': files
99+
});
100+
}
101+
let sr = loader.require('seedrandom', files, executedFiles, {
102+
'map': {
103+
'seedrandom': 'https://cdn.jsdelivr.net/npm/[email protected]/seedrandom.min'
104+
}
105+
})[0];
106+
```
107+
98108
## Test
99109

100110
### Node
@@ -103,7 +113,7 @@ After compiling the TS code, execute: node dist/test-on-node to observe the exec
103113

104114
### Browser
105115

106-
Use your browser to access "test/" to see if the results are consistent with the node environment.
116+
Use the browser to visit "test/" to view the comparison results are the same as in the node environment.
107117

108118
[You can also click here to access the example online.](https://litert.github.io/loader.js/test/)
109119

‎doc/README.zh-CN.md‎

Lines changed: 52 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -12,15 +12,15 @@
1212

1313
## 语言
1414

15-
[English](../README.md) | [繁體中文](README.zh-TW.md)
15+
[English](../README.md) | [繁體中文](README.zh-tw.md)
1616

1717
## 特性
1818

19+
- [x] 支持直接运行内存中的文件代码。
1920
- [x] 库轻量，配置简单。
2021
- [x] 无侵入，不会对您的 script 引入的其他库造成任何影响。
2122
- [x] 支持 CommonJS、ES6 Module 格式。
22-
- [x] 自动支持 fetch 函数，无需额外加载。
23-
- [x] 支持直接运行内存中的文件代码。
23+
- [x] 自动支持 fetch 函数，无需额外加载。
2424

2525
## 安装
2626

@@ -42,39 +42,66 @@ $ npm i @litert/loader@dev --save
4242

4343
### CDN（推荐）
4444

45-
推荐引用地址：https://cdn.jsdelivr.net/npm/@litert/loader@0.1.1/dist/index.min.js，当然这不一定是最新版本，可以将版本号改为最新版本，或者在此处查找：https://cdn.jsdelivr.net/npm/@litert/loader/。
45+
推荐引用地址：https://cdn.jsdelivr.net/npm/@litert/loader@x.x.x/dist/index.min.js，当然 x.x.x 只是个例子需要改为正式版本号，也可以此处查找：https://cdn.jsdelivr.net/npm/@litert/loader/。
4646

47-
同样可使用 [unpkg](https://unpkg.com/@litert/loader@0.1.1/dist/index.min.js).
47+
同样可使用 [unpkg](https://unpkg.com/@litert/loader@x.x.x/dist/index.min.js)。
4848

49-
例子：
49+
## Usage
50+
51+
通常的使用方式：
5052

5153
```html
52-
<script src="https://cdn.jsdelivr.net/npm/@litert/loader@0.1.1/dist/index.min.js"></script>
54+
<script src="https://cdn.jsdelivr.net/npm/@litert/loader@x.x.x/dist/index.min.js"></script>
5355
```
5456

55-
## Usage
57+
```typescript
58+
// 所有操作请写在 ready 回调函数当中。
59+
loader.ready(function() {
60+
let files: Record<string, Blob | string> = { ... };
61+
let executedFiles: Record<string, any> = {};
62+
let tmodule: any, module2: any;
63+
[tmodule, module2] = loader.require(['../dist/tmodule', './module2'], files, executedFiles);
64+
});
65+
```
5666

57-
通常的使用方式：
67+
你可以使用 fetchFiles 方法加载网络文件到内存。
5868

59-
```html
60-
<script src="https://cdn.jsdelivr.net/npm/@litert/[email protected]/dist/index.min.js"></script>
69+
```typescript
70+
let files: Record<string, Blob | string> = await loader.fetchFiles([
71+
'../dist/tmodule.js',
72+
'./module2.js',
73+
'https://cdn.jsdelivr.net/npm/[email protected]/seedrandom.min.js'
74+
]);
6175
```
6276

63-
```javascript
64-
// 添加的映射路径无需带“.js”后缀。
65-
loader.setPaths({
66-
"module": "https://xxx/xxx/index",
67-
"module2": "../abc/in"
77+
使用 sniffFiles 加载网络文件到内存，会嗅探文件中的包含关系，例如 js 的 import、require 等，CSS 的 url 等。
78+
79+
```typescript
80+
let files: Record<string, Blob | string> = {};
81+
await loader.sniffFiles([
82+
'https://cdn.jsdelivr.net/npm/@juggle/[email protected]/lib/exports/resize-observer.js'
83+
], {
84+
'files': files
6885
});
69-
loader.addPath("module3", "./en");
70-
// 可在文件后面追加字符串，例如可以用来防止缓存。
71-
loader.setAfter("?" + Math.random());
72-
// 所有操作请写在回调函数当中。
73-
loader.ready(function() {
74-
loader.require(["../dist/tmodule", "module2"], function(t1, t2) {
75-
// 可以写一些内容，当然也可以不使用回调函数。
86+
```
87+
88+
使用 map 选项，可以指定库的别名，import 命令的别名也以此为依据。
89+
90+
```typescript
91+
let executedFiles: Record<string, any> = {};
92+
let files: Record<string, Blob | string> = {};
93+
if (!Object.keys(files).includes('https://cdn.jsdelivr.net/npm/[email protected]/seedrandom.min.js')) {
94+
await loader.fetchFiles([
95+
'https://cdn.jsdelivr.net/npm/[email protected]/seedrandom.min.js'
96+
], {
97+
'files': files
7698
});
77-
});
99+
}
100+
let sr = loader.require('seedrandom', files, executedFiles, {
101+
'map': {
102+
'seedrandom': 'https://cdn.jsdelivr.net/npm/[email protected]/seedrandom.min'
103+
}
104+
})[0];
78105
```
79106

80107
## 测试
@@ -85,7 +112,7 @@ loader.ready(function() {
85112

86113
### 浏览器
87114

88-
使用浏览器访问“test/”来查看比对结果是否和 node 环境中相同。
115+
使用浏览器访问“test/”来查看比对结果与 node 环境中相同。
89116

90117
[你也可以直接点这里在线查看浏览器示例。](https://litert.github.io/loader.js/test/)
91118

‎doc/README.zh-TW.md‎

Lines changed: 51 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -12,15 +12,15 @@
1212

1313
## 語言
1414

15-
[English](../README.md) | [简体中文](README.zh-CN.md)
15+
[English](../README.md) | [简体中文](README.zh-cn.md)
1616

1717
## 特性
1818

19+
- [x] 支援直接運行記憶體檔案代碼。
1920
- [x] 庫輕量，配置簡單。
2021
- [x] 無侵入，不會對您的 script 引入的其他庫造成任何影響。
2122
- [x] 支援 CommonJS、ES6 Module 格式。
2223
- [x] 自動支援 fetch 函數，無需額外載入。
23-
- [x] 支援直接運行記憶體檔案代碼。
2424

2525
## 安裝
2626

@@ -42,41 +42,68 @@ $ npm i @litert/loader@dev --save
4242

4343
### CDN（推薦）
4444

45-
推薦引用位址：https://cdn.jsdelivr.net/npm/@litert/loader@0.1.1/dist/index.min.js，當然這不一定是最新版本，可以將版本號改為最新版本，或者在此處查找：HTTPs://cdn.jsdelivr.net/npm/@litert/loader/。
45+
推薦引用位址：https://cdn.jsdelivr.net/npm/@litert/loader@x.x.x/dist/index.min.js，當然 x.x.x 只是個例子需要改為正式版本號，也可以此處查找：https://cdn.jsdelivr.net/npm/@litert/loader/。
4646

47-
同樣可使用 [unpkg](https://unpkg.com/@litert/[email protected]/dist/index.min.js).
48-
49-
例子：
50-
51-
```html
52-
<script src="https://cdn.jsdelivr.net/npm/@litert/[email protected]/dist/index.min.js"></script>
53-
```
47+
同樣可使用 [unpkg](https://unpkg.com/@litert/[email protected]/dist/index.min.js)。
5448

5549
## Usage
5650

5751
通常的使用方式：
5852

5953
```html
60-
<script src="https://cdn.jsdelivr.net/npm/@litert/loader@0.1.1/dist/index.min.js"></script>
54+
<script src="https://cdn.jsdelivr.net/npm/@litert/loader@x.x.x/dist/index.min.js"></script>
6155
```
6256

63-
```javascript
64-
// 添加的映射路徑無需帶「.js」尾碼。
65-
loader.setPaths({
66-
"module": "https://xxx/xxx/index",
67-
"module2": "../abc/in"
68-
});
69-
loader.addPath("module3", "./en");
70-
// 可在檔後面追加字串，例如可以用來防止緩存。
71-
loader.setAfter("?" + Math.random());
57+
```typescript
7258
// 所有操作請寫在回呼函數當中。
7359
loader.ready(function() {
74-
loader.require(["../dist/tmodule", "module2"], function(t1, t2) {
75-
// 可以寫一些內容，當然也可以不使用回呼函數。
76-
});
60+
let files: Record<string, Blob | string> = { ... };
61+
let executedFiles: Record<string, any> = {};
62+
let tmodule: any, module2: any;
63+
[tmodule, module2] = loader.require(['../dist/tmodule', './module2'], files, executedFiles);
7764
});
7865
```
7966

67+
你可以使用 fetchFiles 方法載入網路檔到記憶體。
68+
69+
```typescript
70+
let files: Record<string, Blob | string> = await loader.fetchFiles([
71+
'../dist/tmodule.js',
72+
'./module2.js',
73+
'https://cdn.jsdelivr.net/npm/[email protected]/seedrandom.min.js'
74+
]);
75+
```
76+
77+
使用 sniffFiles 載入網路檔案到記憶體，會嗅探檔中的包含關係，例如 js 的 import、require 等，CSS 的 url 等。
78+
79+
```typescript
80+
let files: Record<string, Blob | string> = {};
81+
await loader.sniffFiles([
82+
'https://cdn.jsdelivr.net/npm/@juggle/[email protected]/lib/exports/resize-observer.js'
83+
], {
84+
'files': files
85+
});
86+
```
87+
88+
使用 map 選項，可以指定庫的別名，import 命令的別名也以此為依據。
89+
90+
```typescript
91+
let executedFiles: Record<string, any> = {};
92+
let files: Record<string, Blob | string> = {};
93+
if (!Object.keys(files).includes('https://cdn.jsdelivr.net/npm/[email protected]/seedrandom.min.js')) {
94+
await loader.fetchFiles([
95+
'https://cdn.jsdelivr.net/npm/[email protected]/seedrandom.min.js'
96+
], {
97+
'files': files
98+
});
99+
}
100+
let sr = loader.require('seedrandom', files, executedFiles, {
101+
'map': {
102+
'seedrandom': 'https://cdn.jsdelivr.net/npm/[email protected]/seedrandom.min'
103+
}
104+
})[0];
105+
```
106+
80107
## 測試
81108

82109
### Node
@@ -85,7 +112,7 @@ loader.ready(function() {
85112

86113
### 瀏覽器
87114

88-
使用瀏覽器訪問「test/」來查看比對結果是否和 node 環境中相同。
115+
使用瀏覽器訪問「test/」來查看比對結果與 node 環境中相同。
89116

90117
[你也可以直接點這裡線上查看瀏覽器示例。](https://litert.github.io/loader.js/test/)
91118

0 commit comments

Comments
 (0)