https://github.com/abhijithvijayan/parcel-sass-bootstrap-boilerplate

⏰📌 Boilerplate with Parcel.js, Sass, Babel & Bootstrap
https://github.com/abhijithvijayan/parcel-sass-bootstrap-boilerplate

babel boilerplate bootstrap jquery parcel-bundler parceljs popperjs sass starter

Last synced: 2 months ago
JSON representation

⏰📌 Boilerplate with Parcel.js, Sass, Babel & Bootstrap

• Host: GitHub
• URL: https://github.com/abhijithvijayan/parcel-sass-bootstrap-boilerplate
• Owner: abhijithvijayan
• License: mit
• Created: 2019-02-02T14:56:12.000Z (almost 6 years ago)
• Default Branch: master
• Last Pushed: 2020-01-30T15:38:15.000Z (almost 5 years ago)
• Last Synced: 2024-10-04T15:35:49.325Z (3 months ago)
• Topics: babel, boilerplate, bootstrap, jquery, parcel-bundler, parceljs, popperjs, sass, starter
• Language: HTML
• Homepage: https://parcel-boilerplate.netlify.com
• Size: 404 KB
• Stars: 15
• Watchers: 5
• Forks: 3
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
parcel-sass-bootstrap-boilerplate




  

    

  

    

  

    

  

    

  

    





  

  SASS

  · Babel

  · Bootstrap

  · Parcel.JS

  · JQuery

  · Popper.JS

  



🙋‍♂️ Made by @abhijithvijayan





  Donate:

  PayPal,

  Patreon





  

    

  







This Parcel-Sass-bootstrap starter contains the features and scripts you need to get started quickly with Parcel bundler.

It contains the following features:

- ParcelJs

- Babel ES6 Compiler

- Bootstrap v4

- JQuery v3.3.1

- PopperJS

- Concatenate and minify JavaScript.

- Compile, minify, autoprefix SASS.

- Hot-Reloading

- Optimize and Cache Images

## Getting Started

### Dependencies

Make sure these are installed first.

- [Node.js](http://nodejs.org)

- [Parcel Bundler](https://parceljs.org/)

  `npm install -g parcel-bundler`

### Quick Start

1. Clone the repo :

   `git clone https://github.com/abhijithvijayan/parcel-sass-bootstrap-boilerplate.git`

2. In bash/terminal/command line, `cd parcel-sass-bootstrap-boilerplate` into project directory.

3. Run `npm install` to install required files and dependencies.

4. Launch the `development environment` with :

   `npm run dev`

Note: **For Production, Use:**

```

npm run build

```

This will build files and assets to `dist/` directory.



## Documentation

### Workflow structure

`src` - > source directory

```

.

├── src

│   ├── assets

│   │   └── trollHuntersArcadia.png

│   ├── sass

│   │   ├── _fonts.scss

│   │   ├── _reset.scss

│   │   ├── _variables.scss

│   │   └── main.scss

│   ├── index.js

│   └── index.html

.

```

### Instructions

- Add your HTML files by inserting or including them in the `src` directory (By default `index.html` is added to the directory, feel free to edit it with the changes seen live.)

  - For the new `HTML` file(s), link the `index.js` (in body tag) file in the `HTML` files as they are created.

    ```

    

        :

        

    

    

        :

        

    

    ```

- Add `sass`(SCSS) files to `src/sass` folder.

  - Make sure you import the scss file in `main.scss`

    ```

    @import "filename";

    ```

- Add `images` to `src/assets` folder.

## Licence

Code released under the [MIT License](LICENSE)