BewlyBewly

English | 简体中文 | 正體中文 | 廣東話

BewlyBewly

Just make a few small changes to your Bilibili homepage.

👋 Introduction

BewlyBewly is a browser extension for BiliBili that aims to enhance the user experience by redesigning the BiliBili UI. The design is inspired by YouTube, Vision OS, and iOS, resulting in a more visually appealing and user-friendly interface.

This project uses the vitesse-webext template for development. Without this template, it may not be possible to develop this project.

⬇️ Installation

Online Installation

Even in the Edge browser, we strongly recommend you install it in the Chrome web store. In terms of review speed, the Chrome web store is slightly faster than Edge Add-ons.

• Chrome: https://chromewebstore.google.com/detail/bewlybewly/bbbiejemhfihiooipfcjmjmbfdmobobp
• Edge: https://microsoftedge.microsoft.com/addons/detail/bewlybewly/kceadhehfjdiakpiphpjgolbgehjdmja
• Firefox: I NEED SOME HELP!!!!!!!!!!!!!!!!!! ( ；∀；)

Local Installation

CI: Automatically build with the latest code

Releases: Stable version

Edge & Chrome (RECOMMENDED)

Ensure you installed extension.zip .

Opening the edge://extensions page in the Edge or chrome://extensions page in Chrome, simply drag and drop the downloaded extension.zip file into the browser to complete the installation.

Another installation method for Edge & Chrome

Edge

Ensure you installed extension.zip and decompress this file.

1. Type in edge://extensions/ in the address bar and press Enter
2. Turn on Developer mode then press Load Unpacked
   
3. Load the decompressed extension folder in your browser

Chrome

Ensure you installed extension.zip and decompress this file.

1. Type in chrome://extensions/ in the address bar and press Enter
2. Turn on Developer mode then press Load Unpacked
   
3. Load the decompressed extension folder in your browser

🔧 Development & Build

Chrome or Edge browser

Chrome or Edge browser

Development (Chrome or Edge)

pnpm dev

Then load the extension in the browser with the extension/ folder. After each modification, you need to click the Extensions Reloader button and refresh the page to ensure the changes will be applied.

Build (Chrome or Edge)

To build the extension, run

pnpm build

And then pack files under the extension

Firefox browser

Before that, please use the dev-firefox branch to perform the operations below. It may contain some bugs or unclear code, and your help in addressing these issues is welcome! :D

Firefox browser

Development (Firefox)

pnpm dev-firefox

Then load the extension in the browser with the extension-firefox/ folder. After each modification, you need to click the Extensions Reloader button and refresh the page to ensure the changes will be applied.

Build (Firefox)

To build the extension, run

pnpm build-firefox

And then pack files under the extension-firefox

🤝 Contribution

About Branches

• Main: This branch is designed for changes that are restricted to documentation files like READMEs, without altering the code or its functionality.
• Dev: Use this branch for new features, performance improvements or modifications to i18n files.
• Bugfixes: This branch should be used exclusively for fixing bugs that appear in the main branch.

I18n

• When doing translations, if you have a language you are not familiar with, you can use another language that you have translated and point out what language you cannot translate in the pull request.

• Please MANUALLY MAINTAIN the i18n files!!! Do not use i18n Ally or other extensions to maintain them. I know you might be confused or might not like this, but using i18n Ally for the maintenance will make it uncertain where to place the translations afterward or delete the code comments.

❤️ Credits

• vitesse-webext - The template used for this project
• UserScripts/bilibiliHome, bilibili-app-recommend - Reference source for obtaining the access key
• Bilibili-Evolved - Partial implementation of functionalities
• bilibili-API-collect