extension 2.0.0-rc.26 → 2.0.0-rc.27
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +24 -43
- package/dist/cli.js +1 -1
- package/package.json +3 -3
package/README.md
CHANGED
|
@@ -10,31 +10,25 @@
|
|
|
10
10
|
[prs-url]: https://github.com/extension-js/extension/blob/main/CONTRIBUTING.md
|
|
11
11
|
[snyk-image]: https://snyk.io/test/github/extension-js/extension/badge.svg
|
|
12
12
|
[snyk-url]: https://snyk.io/test/github/extension-js/extension
|
|
13
|
-
[
|
|
14
|
-
[
|
|
13
|
+
[npm-version-image]: https://img.shields.io/npm/v/extension.svg?color=0971fe
|
|
14
|
+
[npm-version-url]: https://www.npmjs.com/package/extension
|
|
15
15
|
[discord-image]: https://img.shields.io/discord/1253608412890271755?label=Discord&logo=discord&style=flat
|
|
16
16
|
[discord-url]: https://discord.gg/v9h2RgeTSN
|
|
17
17
|
|
|
18
|
-
# Extension.js [![
|
|
18
|
+
# Extension.js [![Version][npm-version-image]][npm-version-url] [![Downloads][downloads-image]][downloads-url] [![workflow][action-image]][action-url] [![discord][discord-image]][discord-url]
|
|
19
19
|
|
|
20
|
-
|
|
20
|
+
> The cross-browser extension framework.
|
|
21
21
|
|
|
22
|
-
|
|
22
|
+
<hr />
|
|
23
23
|
|
|
24
|
-
|
|
25
|
-
<hr> -->
|
|
26
|
-
|
|
27
|
-
<img alt="Logo" align="right" src="https://user-images.githubusercontent.com/4672033/102850460-4d22aa80-43f8-11eb-82db-9efce586f73e.png" width="25%" />
|
|
28
|
-
|
|
29
|
-
<!-- **Create cross-browser extensions with no build configuration.** -->
|
|
30
|
-
|
|
31
|
-
> Plug-and-play, zero-config, cross-browser extension development tool.
|
|
24
|
+
<img alt="Logo" align="right" src="https://user-images.githubusercontent.com/4672033/102850460-4d22aa80-43f8-11eb-82db-9efce586f73e.png" width="22.5%" />
|
|
32
25
|
|
|
33
26
|
- [Create A New Extension](#create-a-new-extension) — How to create a new extension.
|
|
34
27
|
- [Get Started Immediately](#get-started-immediately) — Get work done in no time.
|
|
35
|
-
- [
|
|
28
|
+
- [Start From A Template](https://extension.land/templates) — Start with your favorite tool.
|
|
29
|
+
- [I have An Extension](#i-have-an-extension) — Use only specific parts of Extension.js.
|
|
36
30
|
|
|
37
|
-
Extension.js
|
|
31
|
+
Extension.js makes it very easy to develop cross-browser extensions.<br />Developers use it due to its fast builds, simple interface, and zero-configuration setup.
|
|
38
32
|
|
|
39
33
|
## Create A New Extension
|
|
40
34
|
|
|
@@ -44,19 +38,15 @@ cd my-extension
|
|
|
44
38
|
npm run dev
|
|
45
39
|
```
|
|
46
40
|
|
|
47
|
-
A new browser instance will open up with your extension ready for development.
|
|
48
|
-
|
|
49
|
-
You are done. Time to hack on your extension!
|
|
50
|
-
|
|
51
41
|
https://github.com/cezaraugusto/extension/assets/4672033/7263d368-99c4-434f-a60a-72c489672586
|
|
52
42
|
|
|
53
|
-
## Web Standards and
|
|
43
|
+
## Web Standards and Framework Support
|
|
54
44
|
|
|
55
|
-
For a preview of extensions running these technologies, see
|
|
45
|
+
For a preview of extensions running these technologies, see the [templates](https://extension.land/templates) website.
|
|
56
46
|
|
|
57
47
|
| <img src="https://github.com/cezaraugusto/extension.js/assets/4672033/a9e2541a-96f0-4caa-9fc9-5fc5c3e901c8" width="70"> | <img src="https://github.com/cezaraugusto/extension.js/assets/4672033/b42c5330-9e2a-4045-99c3-1f7d264dfaf4" width="70"> | <img src="https://github.com/cezaraugusto/extension.js/assets/4672033/f19edff3-9005-4f50-b05c-fba615896a7f" width="70"> | <img src="https://github.com/cezaraugusto/extension.js/assets/4672033/ff64721d-d145-4213-930d-e70193f8d57e" width="70"> | <img src="https://github.com/cezaraugusto/extension.js/assets/4672033/15f1314a-aa65-4ce2-a3f3-cf53c4f730cf" width="70"> | <img src="https://github.com/cezaraugusto/extension.js/assets/4672033/c5f8a127-3c2a-4ceb-bb46-948cf2c8bd89" width="70"> | <img src="https://github.com/cezaraugusto/extension.js/assets/4672033/de1082fd-7cf6-4202-8c12-a5c3cd3e5b42" width="70"> | <img src="https://github.com/cezaraugusto/extension.js/assets/4672033/78e5fe3d-dc79-4aa2-954e-1a5973d1d9db" width="70"> | <img src="https://github.com/cezaraugusto/extension.js/assets/4672033/8807efd9-93e5-4db5-a1d2-9ac524f7ecc2" width="70"> |
|
|
58
48
|
| :---------------------------------------------------------------------------------------------------------------------: | :---------------------------------------------------------------------------------------------------------------------: | :---------------------------------------------------------------------------------------------------------------------: | :---------------------------------------------------------------------------------------------------------------------: | :---------------------------------------------------------------------------------------------------------------------: | :---------------------------------------------------------------------------------------------------------------------: | :---------------------------------------------------------------------------------------------------------------------: | :---------------------------------------------------------------------------------------------------------------------: | :---------------------------------------------------------------------------------------------------------------------: |
|
|
59
|
-
|
|
|
49
|
+
| ESNext<br>latest | TypeScript<br>latest | WASM<br>latest | React<br>18+ | Vue<br>3+ | Angular<br>👋 | Svelte<br>5+ | Solid<br>👋 | Preact<br>10+ |
|
|
60
50
|
|
|
61
51
|
👋 = PR Welcome!
|
|
62
52
|
|
|
@@ -74,9 +64,10 @@ https://github.com/cezaraugusto/extension/assets/4672033/ee221a94-6ec7-4e04-8553
|
|
|
74
64
|
|
|
75
65
|
</details>
|
|
76
66
|
|
|
67
|
+
<!--
|
|
77
68
|
<details>
|
|
78
|
-
<summary>
|
|
79
|
-
🔥 Use Edge to start developing an extension from Chrome Extension Samples
|
|
69
|
+
<summary>
|
|
70
|
+
🔥 Use Edge to start developing an extension from Chrome Extension Samples
|
|
80
71
|
</summary>
|
|
81
72
|
|
|
82
73
|
> See the example below where we request the sample [magic8ball](https://github.com/GoogleChrome/chrome-extensions-samples/tree/main/api-samples/topSites/magic8ball) from from [Google Chrome Extension Samples](https://github.com/GoogleChrome/chrome-extensions-samples) with Edge as the runtime browser.
|
|
@@ -118,12 +109,13 @@ npx extension dev https://github.com/mdn/webextensions-examples/tree/main/firefo
|
|
|
118
109
|
https://github.com/cezaraugusto/extension.js/assets/4672033/ac94b608-c936-40df-bce7-63ffd7fe31c5
|
|
119
110
|
|
|
120
111
|
</details>
|
|
112
|
+
-->
|
|
121
113
|
|
|
122
114
|
## I have An Extension
|
|
123
115
|
|
|
124
116
|
https://github.com/cezaraugusto/extension/assets/4672033/48694a23-b7f1-4098-9c5d-eff49983739c
|
|
125
117
|
|
|
126
|
-
If you have an existing extension which is using a package manager, you can install the Extension.js package and manually create the scripts used to run your extension.
|
|
118
|
+
If you have an existing extension which is using a package manager, you can install the Extension.js package and manually create the scripts used to run your extension.
|
|
127
119
|
|
|
128
120
|
**Step 1 - Install extension as a `devDependency`**
|
|
129
121
|
|
|
@@ -138,7 +130,7 @@ npm install extension --save-dev
|
|
|
138
130
|
"scripts": {
|
|
139
131
|
"build": "extension build",
|
|
140
132
|
"dev": "extension dev",
|
|
141
|
-
"
|
|
133
|
+
"preview": "extension preview"
|
|
142
134
|
},
|
|
143
135
|
"devDependencies": {
|
|
144
136
|
// ...other dependencies
|
|
@@ -150,18 +142,18 @@ npm install extension --save-dev
|
|
|
150
142
|
Done. You are all set!
|
|
151
143
|
|
|
152
144
|
- To develop the extension, run `npm run dev`.
|
|
153
|
-
- To visualize the extension in production mode, run `npm run start`.
|
|
154
145
|
- To build the extension in production mode, run `npm run build`.
|
|
146
|
+
- To visualize the extension in production mode, run `npm run build` and `npm run preview`.
|
|
155
147
|
|
|
156
148
|
## Using a specific browser for development
|
|
157
149
|
|
|
158
150
|
### Desktop Browsers
|
|
159
151
|
|
|
160
|
-
| <img src="https://
|
|
161
|
-
|
|
|
162
|
-
|
|
|
152
|
+
| <img src="https://raw.githubusercontent.com/alrra/browser-logos/main/src/chrome/chrome.svg" width="70"> | <img src="https://raw.githubusercontent.com/alrra/browser-logos/main/src/chromium/chromium.svg" width="70"> | <img src="https://raw.githubusercontent.com/alrra/browser-logos/main/src/edge/edge.svg" width="70"> | <img src="https://raw.githubusercontent.com/alrra/browser-logos/main/src/firefox/firefox.svg" width="70"> | <img src="https://raw.githubusercontent.com/alrra/browser-logos/main/src/opera/opera.svg" width="70"> | <img src="https://raw.githubusercontent.com/alrra/browser-logos/main/src/safari/safari.svg" width="70"> |
|
|
153
|
+
| :-----------------------------------------------------------------------------------------------------: | :---------------------------------------------------------------------------------------------------------: | :-------------------------------------------------------------------------------------------------: | :-------------------------------------------------------------------------------------------------------: | :---------------------------------------------------------------------------------------------------: | :-----------------------------------------------------------------------------------------------------: |
|
|
154
|
+
| Chrome<br>✅ | Chromium<br>☑️ | Edge<br>✅ | Firefox<br>✅ | Opera<br>☑️ | Safari<br>⛔️ |
|
|
163
155
|
|
|
164
|
-
|
|
156
|
+
The browsers listed above represent those with official extension stores. Note that Chromium-based browsers (like Arc, Brave, Vivaldi, and many others) are theoretically supported through the Chrome/Chromium compatibility layer.
|
|
165
157
|
|
|
166
158
|
### Mobile Browsers
|
|
167
159
|
|
|
@@ -169,17 +161,6 @@ Done. You are all set!
|
|
|
169
161
|
| :-------------------------------------------------------------------------------------------------------: | :-------------------------------------------------------------------------------------------------------------: |
|
|
170
162
|
| Firefox (Android)<br>⛔️ | Safari (iOS)<br>⛔️ |
|
|
171
163
|
|
|
172
|
-
If you want to target a specific browser, just pass the `--browser` flag to the `dev`/`start` command (based on the list available above), like `npx extension dev path/to/extension --browser=edge`.
|
|
173
|
-
|
|
174
|
-
> Hint
|
|
175
|
-
> Pass --browser="all" to load all available browsers at once.
|
|
176
|
-
|
|
177
|
-
```sh
|
|
178
|
-
extension dev --browser=all
|
|
179
|
-
```
|
|
180
|
-
|
|
181
|
-
<img alt="Extension.js with all the browser runners open" src="https://github.com/cezaraugusto/extension.js/assets/4672033/f0f5bbfc-e873-4856-9fdd-db2b42d9ab96">
|
|
182
|
-
|
|
183
164
|
## License
|
|
184
165
|
|
|
185
|
-
MIT (c) Cezar Augusto.
|
|
166
|
+
MIT (c) Cezar Augusto and the Extension.js authors.
|
package/dist/cli.js
CHANGED
|
@@ -86,7 +86,7 @@ async function check_updates_checkUpdates(packageJson) {
|
|
|
86
86
|
}
|
|
87
87
|
if (update && isStableVersion(update.latest)) console.log(checkUpdates(packageJson, update));
|
|
88
88
|
}
|
|
89
|
-
var package_namespaceObject = JSON.parse('{"license":"MIT","repository":{"type":"git","url":"https://github.com/cezaraugusto/extension.git","directory":"programs/cli"},"engines":{"node":">=18"},"exports":{".":{"types":"./dist/cli.d.ts","import":"./dist/cli.js","require":"./dist/cli.js"}},"main":"./dist/cli.js","types":"./dist/cli.d.ts","files":["dist"],"bin":{"extension":"./dist/cli.js"},"name":"extension","version":"2.0.0-rc.
|
|
89
|
+
var package_namespaceObject = JSON.parse('{"license":"MIT","repository":{"type":"git","url":"https://github.com/cezaraugusto/extension.git","directory":"programs/cli"},"engines":{"node":">=18"},"exports":{".":{"types":"./dist/cli.d.ts","import":"./dist/cli.js","require":"./dist/cli.js"}},"main":"./dist/cli.js","types":"./dist/cli.d.ts","files":["dist"],"bin":{"extension":"./dist/cli.js"},"name":"extension","version":"2.0.0-rc.27","description":"Create cross-browser extensions with no build configuration.","author":{"name":"Cezar Augusto","email":"boss@cezaraugusto.net","url":"https://cezaraugusto.com"},"scripts":{"watch":"rslib build --watch","compile:types":"bash install_scripts.sh","compile:readme-files":"node ./scripts/copyMarkdownFilesToCli.js","compile:cli":"rslib build","compile":"pnpm compile:readme-files && pnpm compile:cli && pnpm compile:types","clean":"rm -rf dist","test":"echo \\"Note: no test specified\\" && exit 0","test:cli":"vitest run"},"keywords":["zero-config","build","develop","browser","extension","chrome extension","edge extension","firefox extension","safari extension","web","react","typescript"],"dependencies":{"chalk":"^5.3.0","@types/chrome":"^0.0.287","@types/firefox-webext-browser":"^120.0.4","@types/node":"^22.10.1","@types/react":"^19.0.1","@types/react-dom":"^19.0.1","commander":"^12.1.0","extension-create":"workspace:*","extension-develop":"workspace:*","semver":"^7.6.3","update-check":"^1.5.4","webextension-polyfill":"^0.12.0"},"devDependencies":{"@rslib/core":"^0.6.9","@types/mock-fs":"^4.13.4","@types/semver":"^7.5.8","mock-fs":"^5.4.1","tsconfig":"*","typescript":"5.7.2"}}');
|
|
90
90
|
check_updates_checkUpdates(package_namespaceObject);
|
|
91
91
|
const extensionJs = external_commander_namespaceObject.program;
|
|
92
92
|
const vendors = (browser)=>'all' === browser ? 'chrome,edge,firefox'.split(',') : browser.split(',');
|
package/package.json
CHANGED
|
@@ -24,7 +24,7 @@
|
|
|
24
24
|
"extension": "./dist/cli.js"
|
|
25
25
|
},
|
|
26
26
|
"name": "extension",
|
|
27
|
-
"version": "2.0.0-rc.
|
|
27
|
+
"version": "2.0.0-rc.27",
|
|
28
28
|
"description": "Create cross-browser extensions with no build configuration.",
|
|
29
29
|
"author": {
|
|
30
30
|
"name": "Cezar Augusto",
|
|
@@ -56,8 +56,8 @@
|
|
|
56
56
|
"semver": "^7.6.3",
|
|
57
57
|
"update-check": "^1.5.4",
|
|
58
58
|
"webextension-polyfill": "^0.12.0",
|
|
59
|
-
"extension-
|
|
60
|
-
"extension-
|
|
59
|
+
"extension-develop": "2.0.0-rc.27",
|
|
60
|
+
"extension-create": "2.0.0-rc.27"
|
|
61
61
|
},
|
|
62
62
|
"devDependencies": {
|
|
63
63
|
"@rslib/core": "^0.6.9",
|