在线时间:8:00-16:00
迪恩网络APP
随时随地掌握行业动态
扫描二维码
关注迪恩网络微信公众号
开源软件名称:mi-g/weh开源软件地址:https://github.com/mi-g/weh开源编程语言:JavaScript 92.8%开源软件介绍:wehweh stands for WebExtensions Helper. This toolkit speeds up browser add-ons development by providing a number of facilities for WebExtensions-based (Firefox, Chrome, Opera and Edge) extensions. This is not a framework in the sense that the developer does not have to embrace all the provided utilities and there are not many architectural constraints to follow in order to take benefit of the tool. The build system generates automatically a directory you can directly install into your browser, compiling automatically CoffeeScript, TypeScript and JSX to Javascript, Sass, Less and Stylus to CSS. weh also provides some libraries that go into your addon to ease a number of common tasks like managing preferences and two-way communications between the extension background and its user interface content pages, providing a way for the end-user to customize any string in the add-on user interface. Developing the user interface using ReactJS is also simplified but you may choose not to use this library. In addition, an inspector application (under the form of a weh-based extension) is provided to monitor other weh extensions in real-time. weh-generated extensions are compatible with Firefox, Chrome, Opera and Edge. You should of course maintain this compatibility in the code you add to your project. install from npm
testing installation
You can now install your skeleton extension from the install from github
You can now move away from the weh directory. using wehTo create a new extension project:
You now have a To build and maintain the add-on:
You will notice that the last Run installing a local add-on into the browser
extension directory structureweh expects all project-specific code to be put into the
Also note that you can change the accessing weh servicesDeclaring You can then access a number of services from the
multi-language supportWeh obviously supports Javascript (
pre-processing filesAll files with a The EJS pre-processing occurs in a first place, so a file named Any text file in the Pre-processing is useful if you want to generate different builds from the same source code. using weh librariesweh preferencesPreferences are to be formally defined in order to be used in your add-on. An example of preferences description could be: weh.prefs.declare([{
name: "myparam_string",
type: "string",
defaultValue: "Default value",
maxLength: 15,
regexp: "^[a-zA-Z ]+$"
},{
name: "myparam_integer",
type: "integer",
defaultValue: 42,
minimum: -10,
maximum: 100
},{
name: "myparam_float",
type: "float",
defaultValue: 3.14159,
minimum: 1.5,
maximum: 10.8
},{
name: "myparam_boolean",
type: "boolean",
defaultValue: true
},{
name: "myparam_choice",
type: "choice",
defaultValue: "second",
choices: [{
name: "First choice",
value: "first"
},{
name: "Second choice",
value: "second"
},{
name: "Third choice",
value: "third"
}]
}]); For each parameter, you must provide at least You can install preferences listeners using You should also define a couple of human viewable strings associated to each parameter in
Example ( "weh_prefs_label_myparam_string": {
"message": "String parameter"
},
"weh_prefs_description_myparam_string": {
"message": "Only letters and spaces, 20 characters max"
}, You can define a number of constraints to your preferences. This is useful with the settings user interface provided by weh.
Note that the preferences definition can be declared or updated at any time. This is useful if, for instance, you don't the list of choices in advance. weh takes care of adding/removing the listener when the component is mounted/unmounted and delivering the message to the debugging toolsThe weh toolkit includes an extension called weh-inspector which allows to:
The weh-inspector is available as a template in the weh toolkit. As such, you can install it with i18nweh provides some utilities for dealing with locales. Instead of
rpcweh provides an easy way to call functions across components that do not run within the same threads. All the functions return promises. If a declared function returns something other than a Promise object, weh takes of promisifying the returned value. Functions are declared on the called side using For instance, the background can define a function like this: weh.rpc.listen({
my_function: (a,b) => {
return a + b;
}
}) and a content script can call the function this way: weh.call("my_function",39,3)
.then((result)=>{
console.info("=",result);
});
When using the If the called function does not exists, throw an exception or return explicitly a failed promise the returned promise is rejected. native messagingweh is also very useful when dealing with native messaging. var nativeApp = require('weh-natmsg')("com.example.myapp");
nativeApp.call("my_function",...params)
.then((result)=>{
// do something
})
.catch((err)=>{
// handle error
}) You can catch all errors due to the native app not being installed (or at least not being callable): nativeApp.onAppNotFound.addListener((err)=>{
// for instance, open a tab to a site where to download the app
}) You can just check whether the app is present, without triggering the nativeApp.callCatchAppNotFound((err)=>{
// this is called if the app could not be launched
},"my_function",...params); On the native app side, assuming it is developed on node.js, you can use the exact same rpc mechanism, using For now, the only implementation of such a native is available on the UI utilities
weh.ui.open("some_name",{
url: "content/content.html",
type: "tab"
});
weh.rpc.call("some_name","my_content_function",...params); |
2023-10-27
2022-08-15
2022-08-17
2022-09-23
2022-08-13
请发表评论