Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/optimumfuturist/swc-webpack-npm-starter
SWC+ Webpack starter for npm package authoring
https://github.com/optimumfuturist/swc-webpack-npm-starter
esbuild esbuild-loader esbuild-plugin swc swc-loader swc-plugin webpack-loader
Last synced: 30 days ago
JSON representation
SWC+ Webpack starter for npm package authoring
- Host: GitHub
- URL: https://github.com/optimumfuturist/swc-webpack-npm-starter
- Owner: optimumfuturist
- License: mit
- Created: 2021-01-22T16:02:38.000Z (almost 4 years ago)
- Default Branch: main
- Last Pushed: 2024-11-04T21:52:22.000Z (about 1 month ago)
- Last Synced: 2024-11-04T22:29:24.520Z (about 1 month ago)
- Topics: esbuild, esbuild-loader, esbuild-plugin, swc, swc-loader, swc-plugin, webpack-loader
- Language: JavaScript
- Homepage: https://optimumfuturist.github.io/swc-webpack-npm-starter/
- Size: 1.82 MB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
- awesome - optimumfuturist/swc-webpack-npm-starter - SWC+ Webpack starter for npm package authoring (JavaScript)
README
# SWC + Webpack NPM Starter
Webpack starter for npm package authoring
[](https://github.com/optimumfuturist/swc-webpack-npm-starter/actions/workflows/build.yml)
[](https://github.com/optimumfuturist/swc-webpack-npm-starter/actions/workflows/codeql.yml)
## Features
* ~~Babel 7~~ SWC for modern javascript authoring
* Webpack 5 for UMD bundling
* ESLint, EditorConfig and Prettier for better dev tooling
* JSDoc 4 for code documentation
## Getting Started
### 1. Clone this repo
Option A: Clone this repo, run `https://github.com/optimumfuturist/webpack-npm-starter.git`
Option B: From the repo page, click on the "**Use this template**" green button (preferred).
If you cloned this repo, remove the current git repository by doing `rm -rf .git`. And then initialize your git repo, then push changes.
### 2. Update package.json
* Update the name, version and description fields
* Update repository, author, homepage fields
* **IMPORTANT!** Please read the package.json file and get to know `npm scripts`.
### 3. Start authoring
* Navigate to `./src/index.js` and start writing. This file is where you begin composing your npm package.
* Add files, subdirectories, or install new npm packages (whatever you need to make your library work)
* Run `npm run dev`; and this command will start webpack watcher in dev mode.
* See NPM Scripts section for more cli options
### 4. Write tests
* In progress
### 5. Tests your modules
* Test your modules in browsers and nodejs modules
* In your terminal, run `npm run build` and then copy the bundled js file from **lib** directory into **examples** directory.
* For **nodejs** In your terminal, run `node examples/node-example.js` and test the results.
* For **browsers** In your terminal, run `npm start`, then go to http://localhost:5001 and test the results.
## NPM Scripts
These npm scripts can be executed by typing `npm run ` in your terminal.
| Command | What does it do? |
|--|--|
| `dev` | Runs Webpack in development mode with watcher enabled |
| `build` | Runs Webpack in production mode, meant for publishing to npm |
| `clean` | Clean **lib** directory |
| `test` | Run your tests |
| `lint` | Run linting for all codes in **src** directory and fix |
| `start` | Starts a web server from **examples** directory, meant for browser testing |
| `start:all` | Runs `npm run dev` as well as starts a web server so that you can continue developing and testing in the browser at http://localhost:5001 |
| `docs` | Generated documentation in **docs** directory using JSDocs 3.0 |
| `start:docs` | Starts a documentation web server at http://localhost:5002 |
## How to publish to NPM registry.
Please use the package **[np](https://github.com/sindresorhus/np)** from Sindre Sorhus.
## Need help?
Please file an issue and I will do my best to assist, answer.