https://github.com/ryanelian/instapack
All-in-one TypeScript and Sass compiler for web applications! :package: :rocket:
https://github.com/ryanelian/instapack
babel build-tool bundler client-side compiler css developer-tools eslint front-end hot-reload html-template javascript minify nodejs react sass sourcemaps typescript vue zero-configuration
Last synced: 2 months ago
JSON representation
All-in-one TypeScript and Sass compiler for web applications! :package: :rocket:
- Host: GitHub
- URL: https://github.com/ryanelian/instapack
- Owner: ryanelian
- License: mit
- Created: 2016-08-19T07:05:32.000Z (almost 9 years ago)
- Default Branch: dev
- Last Pushed: 2024-12-07T02:49:09.000Z (6 months ago)
- Last Synced: 2025-04-04T01:08:05.664Z (2 months ago)
- Topics: babel, build-tool, bundler, client-side, compiler, css, developer-tools, eslint, front-end, hot-reload, html-template, javascript, minify, nodejs, react, sass, sourcemaps, typescript, vue, zero-configuration
- Language: TypeScript
- Homepage: https://www.npmjs.com/package/instapack
- Size: 5.12 MB
- Stars: 142
- Watchers: 1
- Forks: 10
- Open Issues: 0
-
Metadata Files:
- Readme: README.MD
- License: LICENSE
Awesome Lists containing this project
README
instapack
All-in-one TypeScript and Sass compiler for web applications! 📦 🚀
## Install
### Option A: Globally Machine-Wide
`npm install -g instapack`
> `pnpm` can also be used but not `yarn`. **Yarn 2 is incompatible with instapack due to [Plug'n'Play](https://yarnpkg.com/features/pnp) [NOT SUPPORTED by TypeScript](https://github.com/microsoft/TypeScript/issues/28289) (and Visual Studio)!**
### Option B: Locally per Project
A local installation in the project is usually more desirable for pinning and synchronizing the instapack version used by the CI and the development team.
1. Ensure `package.json` exists in the project folder. (If not, run `npm init -y`)
2. Open command prompt in that folder to install instapack locally: `npm install instapack -D -E`
3. Add [npm run scripts](https://docs.npmjs.com/cli/run-script) in `package.json`:
React
Vue 3
```jsonc
{
"scripts": {
"init": "ipack new react",
"dev": "ipack -R",
"build": "ipack"
}
}
```
```jsonc
{
"scripts": {
"init": "ipack new vue",
"dev": "ipack -s",
"build": "ipack"
}
}
```
To develop using instapack, simply run the commands:
```bash
npm run init
npm run dev
npm run build
```
## Quick Start Guide
```bash
mkdir MyWebApp
cd MyWebApp
ipack new empty
ipack
```
Out of the box, these files will be used as the program entry points:
- `client/js/index.ts` compiled to `wwwroot/js/ipack.js`
- Include this file at the bottom of your HTML / before `