Quasar and Browser Extension Development - Getting BEXy - Part 3
Tags: browserextension, vue, quasar, javascript
Published: 2020-04-30 10:01:59

---
title: Quasar and Browser Extension Development - Getting BEXy - Part 3
published: true
description: A series of articles to demonstrate Quasar's new BEX mode of development for browser extensions
tags: browser extension, Vue, Quasar, javascript
---

### **Part 3 - Building and Publishing your Extension**

![](https://i.imgur.com/e0KeUZd.png)

If you are coming here for the first time, please do start with **[the first Part](https://dev.to/quasar/quasar-and-browser-extension-development-getting-bexy-part-1-39bl)**, as it will get you started with Quasar and a BEX project.

**This article series has 3 parts:**

* **[Part 1 - Introduction](https://dev.to/quasar/quasar-and-browser-extension-development-getting-bexy-part-1-39bl)**
* **[Part 2 - Developing your Browser Extension](https://dev.to/quasar/quasar-and-browser-extension-development-getting-bexy-part-2-17ea)** 
* **Part 3 - Building and Publishing your Extension (*You are here now*)**


In the past part of the article, we went over our Todo app and how to program it as a browser extension (BEX) with Quasar's BEX mode of development. It was just a general run-through to get you familiar with how a Quasar app and the components are needed to make a browser extension work together. 

Now that you have your latest and greatest app finished, it is ready to be offered to the rest of the world. To do that, it needs to be built and published. 

## Building your Project

This is probably the easiest part of process of creating a BEX and it is all because of Quasar's great CLI. 

In your project's root/ working directory, simply run this command:

```
$ quasar build -m bex

# ..or the longer form:
$ quasar build --mode bex
```

Once the build process is finished, you should see something like this in your console showing the build was successful. 

![](https://i.imgur.com/hVPE0Ad.png)

Go to the noted output folder to get your distributable app and publish it. 


## Publishing your Project

Ok, now that you have your project built for production and are in the newly created `dist` folder, have a look at what is waiting for you there under the `Packaged` folder. 

![](https://i.imgur.com/E2GsKIH.png)

There are two zip files under their respective folders for either the **[Chrome's Web Store](https://chrome.google.com/webstore/category/extensions)** or **[Firefox Add-on Extensions Store](https://addons.mozilla.org/en-US/firefox/extensions/)**. 

You can use these zip files to publish to those market places. Each market place has their own process and rules, so please do take care to learn about them. 

[**Chrome Extension Publication**](https://developer.chrome.com/webstore/publish)

[**Firefox Extension Publication**](https://extensionworkshop.com/documentation/publish/)

In theory, the browser extension you have built should work in any other Chromium based browser, however only these two are currently 100% supported. If you are interested in support for other browsers, please let us know on **[Github](https://github.com/quasarframework/quasar/issues)**. Better yet, become a contributor and help us develop BEX mode and the publication process for those other browsers! 

## Conclusion

That's it! You are off to the races as a new browser extension developer with Quasar's BEX mode. 

What do you think of Quasar's new BEX mode? Are you intrigued by how simple it is in the end? We hope you are. Let us know about what you are thinking in the comments below.

**For more Info:**

**[The Quasar Website ](https://quasar.dev/)**
**[More on BEX Mode](https://quasar.dev/quasar-cli/developing-browser-extensions/introduction)**
**[More about Icon Genie](https://quasar.dev/icongenie/introduction)**