lucianesantcs/vitets-sass

⚡Frontend boilerplate using TS + SASS

Vite + TS + Sass Boilerplate

This is a boilerplate to create simple HTML CSS/SCSS TS pages.

Before using:

• If it's just a plain HTML CSS TS page, delete everything on main.ts file and use only the index.html file to structure your code.
  • Start coding replacing div app with your HTML.
  • You will have to import your style.scss and any other .ts file in the HTML
• If it's a more structured project that will use a lot of typescript, keep the structure as it is.

Pre-settings:

• Prettier
• Eslint
• Husky
• Lint Staged

Run the project:

• Use Node.js v18 or higher
  • Older versions
• Run the command npm install to install the dependencies.
• Run the command npm run dev to install open the project.
  • Check the terminal to see the URL of the project. Eg: Local:http://localhost:5173/

---

Build & Deploy the project to Github Pages:

Run the commands:

• Run npm run build to build the project to the .dist folder
• Run npm run deploy to deploy the code the the github pages to the gh-pages branch
• If you prefer to run both, use npm run build-deploy instead and it'll build then deploy

Configure the repository:

• Go to Settings -> Click on Pages. On the Build and deployment section, make sure Source is Deploy from a branch. Then, Branch should be "gh-pages" to the folder "/root"
• Check the live site on the url: https://{username}.github.io/{repo-name}/.
  Eg: https://lucianesantcs.github.io/vitets-sass/