web-ext
web-ext copied to clipboard
mozilla
web-ext new: create the directory layout for an extension
We should add a web-ext new command that automatically generate a manifest.json file and other common files to help the developer get started on a new WebExtension.
You could take a look at how ember new works for ideas.
The jpm init command is also similar but I like the general behavior of ember new better.
@kumar303 I want to work on this! But I need some heads up, about the where I should get started with the web-ext code. And yeah I have created some very basic Web Extensions. So, I think I can try this.
To do this, I want to know the exact requirements. So, from what you mentioned, I see that you want ember like behavior. Does that mean that you want an web-ext new and an web-ext init, where in web-ext new has an extra work of creating the main directory (parent directory) of the Web Extension and then doing web-ext init work of creating manifest.json and may be other files/folders too inside the parent directory.
So, how should I go about creating this ? Should it be like a Web Extension template (because ember does it that way, from what I see) ? Or should I create the manifest.json in an interactive manner, by asking the developer about the Extension (like npm init) ? If it's interactive, I can actually create some files and folders automatically based on the manifest.json. Makes the developer's life easier. Or else, if it's not interactive, then I have to create some files and folders as a template and also I need to consider them and make it minimal and not include all files that can be present in a Web Extension.
Hi @karuppiah7890 , that's great! This is a big patch and will require a lot of work. I don't want to dissuade you but I would suggest starting with some good first bugs before this one, just so you can get a feel for contributing to web-ext.
That said, I think manifest.json should be created in an interactive manner, yes. I don't think we need a separate init command. Let's start with web-ext new that does it all and then see if we still need a separte init command.
Dupe of #141? (Or maybe dupe #141 to this issue?)
(Also, as an npm/jpm user I think we should at least alias init to new, if not provide both.)
@andymckay left this comment on https://github.com/mozilla/web-ext/issues/141
There are a few projects that kind of do this already:
- https://github.com/yeoman/generator-chrome-extension
- http://extensionizr.com/
There are probably more, would it make sense to work with an existing project on this?
as an npm/jpm user I think we should at least alias init to new
Sure, we could add a hidden alias. It probably makes sense to put a page in the docs about translating jpm to web-ext soon. We have been using more aptly named commands when necessary. For example, jpm xpi is web-ext build.
As another project to consider, is the one I've just created at https://github.com/Standard8/example-webextension/
This doesn't have an init function for creating a new repository, but it does have full testing support, and the building is based around web-ext wrapped with npm only.
I'd like to start with the basic option of this (adding new cli option and creating manifest.json).
@rpl created a separate package based on now closed PR. I would like to implement the command using it (it would most likely require contributing to the package itself as well).
+1, I was searching for an init command but couldn't find one. Will this feature be merged in, or should I assume that create-webextention will take its place? Either way, it'd be great if the documentation could be updated with the decision.
Thanks for this, it was indeed necessary. Any news on when it will be integrated into web-ext?
The last remaining step to this issue is to integrate the create-webextension package with web-ext. Until then, you could use create-webextension on its own following the readme instructions.
For future reference:
long time ago I created a small create-webextension npm package that does generate a boilerplate extension (I often use it to generate small test extensions), e.g. you can run it without installing the npm package using npx:
npx create-webextension test-extension-01
this created a new test-extension-01 directory that include a small webextension boilerplate for the generated extension
by including the create- prefix in the package name it is also allowed to be used in an npm init or yarn create command as well:
npm init webextension test-extension-02
# or
yarn create webextension test-extension-03
Going forward, Is there a plan to integrate this feature with web-ext?
Going forward, Is there a plan to integrate this feature with web-ext?
@ankushduacodes I'm a bit on the fence about it, but I avoided to use any big or complex dependency in the create-webextension package in case we do decide to proceed and add it as a dependency.
The idea drafted in #1170 was to include a version of create-webextension package as a dependency (so that the create command would be able to work even without any internet connection) but to execute it using libnpx to allow a user to run the last version of create-webextension package available on npm (in case the template has been updated in the main time for whatever reason), and also to possibly expand it in the future to allow using an npm package with a different name (e.g. to provide third party templates, e.g. to cover some more specialized templates).
@rpl Do you think its good idea to add some documentation here in extension-workshop so that people are aware of the existence of this tool?
@rpl Do you think its good idea to add some documentation here in extension-workshop so that people are aware of the existence of this tool?
In extension-workshop we do have another page that provides some info and links to some tools useful to develop extensions:
- https://github.com/mozilla/extension-workshop/blob/master/src/content/documentation/develop/browser-extension-development-tools.md
It looks that we are already linking another boilerplate generator named create-web-ext, from what I recall this boilerplate generator provides a bit more options, which may be nicer for newcomers that do not know a lot about the manifest.json file yet.
As a side note, I'm wondering if that page is discoverable enough, from my perspective it should be, because it is linked in the first part of the develop section (https://extensionworkshop.com/documentation/develop/).
Maybe we should link the extension-workshop develop section from the web-ext README and/or the web-ext doc page in extension-workshop.
@caitmuenster what do you think about this ^? (the part related to discoverability of that doc page in the extension-workshop and how to we may make it more easily reached by the developers that may be interested to the content linked from that doc page, like the boilerplate generator).
In my opinion, it would be nice to have a link that points to the tool in #using-web-ext as we are already pointing out the fact that if user doesn't have an extension, they may want to use one of the examples.
Before you start using web-ext locate an example extension to use—if you don’t have one, use one from the webextensions-examples repo., My addition would be to add + or Visit our boilerplate tool to get started with a fresh extension, something of that sort
@rpl @caitmuenster
Reading this, i feel like you over-over-overcomplicate this. I am Rust user, and cargo new is very simple command. When i run web-ext new/init i expect same, VERY basic layout. No need for depedencies, no need for complicated logic. Just manifest, 1 empty content-script, 1 background script. Instead this issue went overengineering, and now it's not resolved since 2016 (4 years!!!).
I suggest to implement web-ext new/init with very basic functionality for very basic template (and the only one, not extendedable or configurable) for new extension. If someone REALLY needs something more advanced, they would start new issue, after basic web-ext new/init is released.
@Fedcomp since when this issue was filed a few things are being done:
-
both npm and yarn introduced a command to bootstrap a package, and long time ago I created a simple create-webextension npm package to leverage that (nothing fancy just a minimal boilerplate like the one you are describing in https://github.com/mozilla/web-ext/issues/540#issuecomment-868336697), and so you can already do run one of the following commands to bootstrap a minimal webextension:
npm init webextension my-test-extension- or
yarn create webextension my-test-extension - or
npx create-webextension mu-test-extension
-
we have also listed in our docs an extension scaffolding tool that provides some more options:
- https://extensionworkshop.com/documentation/develop/browser-extension-development-tools/
@rpl i can use your package (in fact i did). My point is: i can't simply run web-ext new extname. I find it being important thing and it's very easy to do. I suggest to make this functionality in web-ext in the most basic form. That's all.
I assume that we need to have a init command prompting for type of extension & create templates based on the user choice
this package can be used https://www.npmjs.com/package/inquirer
