Skip to content

Commit 8fe80bd

Browse files
authored
[chore] format code and fix lint issues (#437)
This PR formats the entire repo and fixes or suppresses all lint issues by running the following commands: - `npm run format` - `npm run lint`
1 parent 0ba1548 commit 8fe80bd

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

61 files changed

+1845
-1369
lines changed

.eslintrc.cjs

+5-3
Original file line numberDiff line numberDiff line change
@@ -5,13 +5,15 @@ module.exports = {
55
root: true,
66
rules: {
77
"@typescript-eslint/no-explicit-any": "off",
8-
"@typescript-eslint/no-empty-function": "off"
8+
"@typescript-eslint/no-empty-function": "off",
9+
"@typescript-eslint/no-non-null-assertion": "off",
910
},
1011
overrides: [
1112
{
12-
"files": ["examples/**/*.js"],
13+
"files": ["examples/**/*.js", "examples/**/*.ts"],
1314
"rules": {
14-
"no-undef": "off"
15+
"no-undef": "off",
16+
"@typescript-eslint/no-unused-vars": "off"
1517
}
1618
}
1719
]

examples/README.md

+10-3
Original file line numberDiff line numberDiff line change
@@ -8,39 +8,46 @@ Please send a pull request if you find things that belongs to here.
88
Note that all examples below run in-browser and use WebGPU as a backend.
99

1010
#### Project List
11+
1112
- [get-started](get-started): minimum get started example with chat completion.
1213

1314
[![Open on JSFiddle](https://img.shields.io/badge/open-JSFiddle-blue?logo=jsfiddle&logoColor=white)](https://jsfiddle.net/neetnestor/yac9gbwf/)
1415
[![Open on Codepen](https://img.shields.io/badge/open-codepen-gainsboro?logo=codepen)](https://codepen.io/neetnestor/pen/NWVdgey)
16+
1517
- [simple-chat-js](simple-chat-js): a mininum and complete chat bot app in vanilla JavaScript.
1618

1719
[![Open on JSFiddle](https://img.shields.io/badge/open-JSFiddle-blue?logo=jsfiddle&logoColor=white)](https://jsfiddle.net/neetnestor/4nmgvsa2/)
1820
[![Open on Codepen](https://img.shields.io/badge/open-codepen-gainsboro?logo=codepen)](https://codepen.io/neetnestor/pen/vYwgZaG)
21+
1922
- [simple-chat-ts](simple-chat-ts): a mininum and complete chat bot app in TypeScript.
2023
- [get-started-web-worker](get-started-web-worker): same as get-started, but using web worker.
2124
- [next-simple-chat](next-simple-chat): a mininum and complete chat bot app with [Next.js](https://nextjs.org/).
2225
- [multi-round-chat](multi-round-chat): while APIs are functional, we internally optimize so that multi round chat usage can reuse KV cache
2326

2427
#### Advanced OpenAI API Capabilities
28+
2529
These examples demonstrate various capabilities via WebLLM's OpenAI-like API.
30+
2631
- [streaming](streaming): return output as chunks in real-time in the form of an AsyncGenerator
2732
- [json-mode](json-mode): efficiently ensure output is in json format, see [OpenAI Reference](https://platform.openai.com/docs/guides/text-generation/chat-completions-api) for more.
2833
- [json-schema](json-schema): besides guaranteeing output to be in JSON, ensure output to adhere to a specific JSON schema specified the user
2934
- [function-calling](function-calling) (WIP): function calling with fields `tools` and `tool_choice`.
3035
- [seed-to-reproduce](seed-to-reproduce): use seeding to ensure reproducible output with fields `seed`.
3136

3237
#### Chrome Extension
38+
3339
- [chrome-extension](chrome-extension): chrome extension that does not have a persistent background
3440
- [chrome-extension-webgpu-service-worker](chrome-extension-webgpu-service-worker): chrome extension using service worker, hence having a persistent background
3541

3642
#### Others
43+
3744
- [logit-processor](logit-processor): while `logit_bias` is supported, we additionally support stateful logit processing where users can specify their own rules. We also expose low-level API `forwardTokensAndSample()`.
3845
- [cache-usage](cache-usage): demonstrates how WebLLM supports both the [Cache API](https://developer.mozilla.org/en-US/docs/Web/API/Cache) and [IndexedDB cache](https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API), and
39-
users can pick with `appConfig.useIndexedDBCache`. Also demonstrates various cache utils such as checking
40-
whether a model is cached, deleting a model's weights from cache, deleting a model library wasm from cache, etc.
46+
users can pick with `appConfig.useIndexedDBCache`. Also demonstrates various cache utils such as checking
47+
whether a model is cached, deleting a model's weights from cache, deleting a model library wasm from cache, etc.
4148
- [simple-chat-upload](simple-chat-upload): demonstrates how to upload local models to WebLLM instead of downloading via a URL link
4249

4350
## Demo Spaces
4451

45-
- [web-llm-embed](https://huggingface.co/spaces/matthoffner/web-llm-embed): document chat prototype using react-llm with transformers.js embeddings
52+
- [web-llm-embed](https://huggingface.co/spaces/matthoffner/web-llm-embed): document chat prototype using react-llm with transformers.js embeddings
4653
- [DeVinci](https://x6occ-biaaa-aaaai-acqzq-cai.icp0.io/): AI chat app based on WebLLM and hosted on decentralized cloud platform

examples/cache-usage/README.md

+1-2
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,9 @@ demonstrate the utility cache functions such as deleting models, checking if mod
66

77
For more information about the two caches, see: https://developer.mozilla.org/en-US/docs/Web/API/Storage_API/Storage_quotas_and_eviction_criteria#what_technologies_store_data_in_the_browser.
88

9-
To inspect the downloaded artifacts in your browser, open up developer console, go to application,
9+
To inspect the downloaded artifacts in your browser, open up developer console, go to application,
1010
and you will find the artifacts under either `IndexedDB` or `Cache storage`.
1111

12-
1312
To run the exapmle, you can do the following steps under this folder
1413

1514
```bash
+19-19
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,24 @@
1-
<!DOCTYPE html>
1+
<!doctype html>
22
<html>
3-
<script>
4-
webLLMGlobal = {}
5-
</script>
3+
<script>
4+
webLLMGlobal = {};
5+
</script>
66

7-
<body>
8-
<h2>WebLLM Test Page</h2>
9-
Open console to see output
10-
</br>
11-
</br>
12-
<label id="init-label"> </label>
7+
<body>
8+
<h2>WebLLM Test Page</h2>
9+
Open console to see output
10+
<br />
11+
<br />
12+
<label id="init-label"> </label>
1313

14-
<h3>Prompt</h3>
15-
<label id="prompt-label"> </label>
14+
<h3>Prompt</h3>
15+
<label id="prompt-label"> </label>
1616

17-
<h3>Response</h3>
18-
<label id="generate-label"> </label>
19-
</br>
20-
<label id="stats-label"> </label>
17+
<h3>Response</h3>
18+
<label id="generate-label"> </label>
19+
<br />
20+
<label id="stats-label"> </label>
2121

22-
<script type="module" src="./cache_usage.ts"></script>
23-
24-
</html>
22+
<script type="module" src="./cache_usage.ts"></script>
23+
</body>
24+
</html>

examples/chrome-extension-webgpu-service-worker/README.md

+7-7
Original file line numberDiff line numberDiff line change
@@ -2,28 +2,28 @@
22

33
![Chrome Extension](https://github.com/mlc-ai/mlc-llm/assets/11940172/0d94cc73-eff1-4128-a6e4-70dc879f04e0)
44

5-
65
> [!WARNING]
76
> Service worker support in WebGPU is enabled by default in [Chrome 124](https://chromiumdash.appspot.com/commit/8d78510e4aca5ac3cd8ee4a33e96b404eaa43246).
87
> If you are using Chrome 123, go to `chrome://flags/#enable-experimental-web-platform-features`, enable the `#enable-experimental-web-platform-features` flag, and **relaunch the browser**.
98
109
This example shows how we can create a Chrome extension using WebGPU and service worker.
1110

1211
- The project structure is as follows:
13-
- `manifest.json`: A required file that lists important information about the structure and behavior of that extension. Here we are using manifest V3.
14-
- `popup.ts`: Script of the extension pop-up window.
15-
- `background.ts`: Script of the service worker. An extension service worker is loaded when it is needed, and unloaded when it goes dormant.
16-
- `content.js`: Content script that interacts with DOM.
12+
- `manifest.json`: A required file that lists important information about the structure and behavior of that extension. Here we are using manifest V3.
13+
- `popup.ts`: Script of the extension pop-up window.
14+
- `background.ts`: Script of the service worker. An extension service worker is loaded when it is needed, and unloaded when it goes dormant.
15+
- `content.js`: Content script that interacts with DOM.
1716
- Run
17+
1818
```bash
1919
npm install
2020
npm run build
2121
```
2222

2323
This will create a new directory at `./dist/`. To load the extension into Chrome, go to Extensions > Manage Extensions and select Load Unpacked. Add the `./dist/` directory. You can now pin the extension to your toolbar and use it to chat with your favorite model!
2424

25-
**Note**: This example disables chatting using the contents of the active tab by default.
25+
**Note**: This example disables chatting using the contents of the active tab by default.
2626
To enable it, set `useContext` in `popup.ts` to `true`. More info about this feature can be found
27-
[here](https://github.com/mlc-ai/web-llm/pull/190).
27+
[here](https://github.com/mlc-ai/web-llm/pull/190).
2828
However, if the web content is too large, it might run into issues. We recommend using `example.html` to
2929
test this feature.

examples/chrome-extension-webgpu-service-worker/src/background.ts

+4-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,7 @@
1-
import { ExtensionServiceWorkerMLCEngineHandler, MLCEngine } from "@mlc-ai/web-llm";
1+
import {
2+
ExtensionServiceWorkerMLCEngineHandler,
3+
MLCEngine,
4+
} from "@mlc-ai/web-llm";
25

36
// Hookup an engine to a service worker handler
47
const engine = new MLCEngine();
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
// Only the content script is able to access the DOM
2-
chrome.runtime.onConnect.addListener(function(port) {
3-
port.onMessage.addListener(function(msg) {
4-
port.postMessage({contents: document.body.innerHTML});
5-
});
6-
});
2+
chrome.runtime.onConnect.addListener(function (port) {
3+
port.onMessage.addListener(function (msg) {
4+
port.postMessage({ contents: document.body.innerHTML });
5+
});
6+
});
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,20 @@
1-
In the year 2154, humanity had colonized several planets in the distant reaches of the galaxy. The planet of Xylophia-IV was one of the most remote and inhospitable, with temperatures often dropping to -200 degrees Celsius. Despite these harsh conditions, a team of scientists had established a research station on the planet to study the unique geological formations and exotic flora and fauna.
2-
3-
One day, while conducting a routine survey of the planet's surface, the team discovered an strange object buried deep in the ice. As they examined it closer, they realized it was a small, metallic capsule with a glowing blue symbol etched onto its surface.
4-
5-
The team's leader, a brilliant scientist named Dr. Maria Rodriguez, was immediately intrigued by the capsule's mysterious origins. She ordered her team to bring it back to the research station for further analysis.
6-
7-
After weeks of studying the capsule, the team finally cracked the code to the symbol etched onto its surface. It was a message from an alien race, warning Earth of an impending attack from an unknown threat.
8-
9-
The team was shocked and dismayed by the news, but they knew they had to act quickly to warn the rest of humanity. They transmitted the message to the nearest space station, which relayed it to Earth's government.
10-
11-
As the threat of attack loomed near, the team remained on high alert, ready to face whatever dangers lay ahead. They had uncovered a secrets of the universe, and now they were determined to protect their planet and its inhabitants at all costs.
1+
In the year 2154, humanity had colonized several planets in the distant reaches
2+
of the galaxy. The planet of Xylophia-IV was one of the most remote and
3+
inhospitable, with temperatures often dropping to -200 degrees Celsius. Despite
4+
these harsh conditions, a team of scientists had established a research station
5+
on the planet to study the unique geological formations and exotic flora and
6+
fauna. One day, while conducting a routine survey of the planet's surface, the
7+
team discovered an strange object buried deep in the ice. As they examined it
8+
closer, they realized it was a small, metallic capsule with a glowing blue
9+
symbol etched onto its surface. The team's leader, a brilliant scientist named
10+
Dr. Maria Rodriguez, was immediately intrigued by the capsule's mysterious
11+
origins. She ordered her team to bring it back to the research station for
12+
further analysis. After weeks of studying the capsule, the team finally cracked
13+
the code to the symbol etched onto its surface. It was a message from an alien
14+
race, warning Earth of an impending attack from an unknown threat. The team was
15+
shocked and dismayed by the news, but they knew they had to act quickly to warn
16+
the rest of humanity. They transmitted the message to the nearest space station,
17+
which relayed it to Earth's government. As the threat of attack loomed near, the
18+
team remained on high alert, ready to face whatever dangers lay ahead. They had
19+
uncovered a secrets of the universe, and now they were determined to protect
20+
their planet and its inhabitants at all costs.

examples/chrome-extension-webgpu-service-worker/src/manifest.json

+2-6
Original file line numberDiff line numberDiff line change
@@ -26,9 +26,5 @@
2626
"service_worker": "background.ts",
2727
"type": "module"
2828
},
29-
"permissions": [
30-
"storage",
31-
"tabs",
32-
"webNavigation"
33-
]
34-
}
29+
"permissions": ["storage", "tabs", "webNavigation"]
30+
}

0 commit comments

Comments
 (0)