nandi.uk
This repository has no description
1# Browser Extension Distribution Guide
2
3This guide covers how to build and distribute the browser extension for team testing and production use.
4
5## Building the Extension
6
7### Development Build
8
9```bash
10npm run dev:extension
11# or
12plasmo dev
13```
14
15### Production Build
16
17```bash
18npm run build:extension
19# or
20plasmo build
21```
22
23This creates a `build/` directory with the production-ready extension files.
24
25### Package for Distribution
26
27```bash
28npm run package:extension
29# or
30plasmo package
31```
32
33This creates a `.zip` file in the `build/` directory that's ready for distribution.
34
35## Distribution Options
36
37### Option A: Share the Build Folder
38
391. Zip the entire `build/chrome-mv3-prod/` folder
402. Share the zip file with your team
413. Team members can load it as an unpacked extension
42
43### Option B: Use the Packaged ZIP
44
451. Share the `.zip` file created by `plasmo package`
462. Team members can extract and load it
47
48## Installation Instructions for Team Members
49
50Send these instructions to your team:
51
521. **Open Chrome Extensions page**: Go to `chrome://extensions/`
532. **Enable Developer mode**: Toggle the switch in the top-right corner
543. **Load the extension**:
55 - Click "Load unpacked"
56 - Select the extracted extension folder (the one containing `manifest.json`)
574. **Pin the extension**: Click the puzzle piece icon and pin your extension for easy access
58
59## Chrome Web Store Distribution (Private)
60
61For more professional distribution:
62
631. **Create a Chrome Web Store developer account** ($5 one-time fee)
642. **Upload your packaged extension**
653. **Set visibility to "Private"** or "Unlisted"
664. **Share the private link** with your team members
67
68## Automated Distribution with GitHub Actions
69
70You can set up GitHub Actions to automatically build and create releases:
71
72```yaml
73# .github/workflows/build-extension.yml
74name: Build Extension
75on:
76 push:
77 tags: ['v*']
78jobs:
79 build:
80 runs-on: ubuntu-latest
81 steps:
82 - uses: actions/checkout@v3
83 - uses: actions/setup-node@v3
84 - run: npm install
85 - run: npm run build:extension
86 - run: npm run package:extension
87 - uses: actions/upload-artifact@v3
88 with:
89 name: extension-build
90 path: build/*.zip
91```
92
93## Quick Start for Team Testing
94
95The fastest approach for immediate team testing:
96
971. Run `npm run build:extension`
982. Zip the `build/chrome-mv3-prod/` folder
993. Share the zip file with your team
1004. Provide the installation instructions above
101
102Your team can then install and test the extension immediately!
103
104## Troubleshooting
105
106### Common Issues
107
108- **Extension not loading**: Make sure you're selecting the folder that contains `manifest.json`
109- **Permissions errors**: Ensure the extension has the necessary permissions in the manifest
110- **Updates not showing**: Reload the extension in `chrome://extensions/` after making changes
111
112### Development vs Production
113
114- Development builds include source maps and debugging tools
115- Production builds are optimized and minified
116- Always test with production builds before distributing