README
vite-skeleton 
The skeleton with the foundational vite configuration for bootstrapping new projects.
Setup 🚀
You can create a new project using the @pota/create package.
npx @pota/create vite my-vite-app
Standards 📒
This project follows the MediaMonks Frontend Coding Standards
Features 🔋
Pota Commands
build - builds the source using vite.
npm run build # or npx pota build
| Option | Type | Default | Description | |||
|---|---|---|---|---|---|---|
debug |
{Boolean} |
false |
Sets NODE_ENV to 'development'. | |||
output |
{String} |
./dist |
The build output directory. | |||
source-map |
{Boolean} |
false |
Enable source-map generation. | |||
public-path |
{String} |
/ |
The location of static assets on your production server. | |||
log-level |
{'info' | 'warn' | 'error' | 'silent'} |
info |
Adjust console output verbosity. (https://vitejs.dev/config/#loglevel) | |||
force |
{Boolean} |
false |
Ignore pre-bundled dependencies (the node_modules/.vite cache). |
dev - starts the vite development server.
npm run dev # or npx pota dev
| Option | Type | Default | Description | |||
|---|---|---|---|---|---|---|
force |
{Boolean} |
false |
Ignore pre-bundled dependencies (the node_modules/.vite cache). | |||
https |
{Boolean} |
false |
Run the development server with HTTPS. | |||
open |
{Boolean} |
true |
Allows to configure dev server to open the browser after the server has been started. | |||
port |
{Number} |
2001 |
Allows configuring the port. | |||
cors |
{Boolean} |
false |
Enable CORS. | |||
prod |
{Boolean} |
false |
Sets NODE_ENV to 'production'. | |||
log-level |
{'info' | 'warn' | 'error' | 'silent'} |
info |
Adjust console output verbosity. (https://vitejs.dev/config/#loglevel) | |||
public-path |
{String} |
/ |
The location of static assets on your production server. |
preview - server the built /dist directory.
npm run preview # or npx pota preview
| Option | Type | Default | Description | |||
|---|---|---|---|---|---|---|
https |
{Boolean} |
false |
Run the development server with HTTPS. | |||
open |
{Boolean} |
true |
Allows to configure dev server to open the browser after the server has been started. | |||
port |
{Number} |
2001 |
Allows configuring the port. | |||
cors |
{Boolean} |
false |
Enable CORS. | |||
log-level |
{'info' | 'warn' | 'error' | 'silent'} |
info |
Adjust console output verbosity. (https://vitejs.dev/config/#loglevel) | |||
public-path |
{String} |
/ |
The location of static assets on your production server. |
hidden TODOs
Scripts
Non-Pota scripts defined in "scripts" of package.json and are runnable using npm run {script}
| Script | Description |
|---|---|
typecheck |
Checks for type errors and unused variables/types in the source directory. |
fix |
Executes all fix:* and `format commands in sequence. |
fix:eslint |
Executes eslint:lint and fixes fixable errors. |
format |
Formats the source files using prettier. |
lint |
Executes all lint:* commands in sequence. |
lint:eslint |
Lints the source files using eslint. |
rsync |
Synchronizes (uploads) dist/ files to a remote server. |
JavaScript / TypeScript
hidden TODOs
CSS
hidden TODOs
Images
hidden TODOs
Misc. Assets
hidden TODOs
Linting & Formatting
hidden TODOs
Deployment
Remote Sync
For simple deployments, when you just want to upload your files to a remote server, you can use the
rsync script.
Note: before using the rsync script, make sure to configure a host in in the "package.json"
npm pkg set config.host="github.com"
hidden TODOs
Git
hidden TODOs
Continuous Integration / Continuous Deployment
Bitbucket
webpack-skeleton comes with bitbucket-pipelines.yml, pre-configured to run check-types, lint
and test scripts.
hidden TODOs