Development

Norio is developed with Vite, Nunjucks, and SCSS. There is no Gulp pipeline, no gulp-file-include, and no Bootstrap build step. Node.js 18 or newer is required.

Quick Start

Download and install Node.js (version 18 or later).
Open a terminal in the norio-html-dev folder.
Install dependencies and start the kit:

    
cd norio-html-dev
npm install
npm run tokens
npm run dev

When the command finishes, the site opens at http://localhost:3000 (LAN is enabled). Vite serves every file in src/pages/*.html as a multipage entry.

Commands

Command	Description
`npm run tokens`	Compile `tokens/tokens.json` into `src/assets/scss/abstracts/_tokens.generated.scss`. Runs automatically before `dev` and `build`.
`npm run dev`	Start the Vite development server.
`npm run build`	Production build into `dist/` — flat HTML plus bundled assets.
`npm run preview`	Preview the compiled `dist/` folder locally.
`npm run lint:fse`	Markup and SCSS guard. Add `-- --strict` to fail on warnings.

How the kit works

Pages in src/pages/ only extend the layout and include sections. Vite writes each one to dist/{name}.html.
Nunjucks resolves includes from src/. Every src/data/*.json file is exposed as a global named after the file (site.json → site).
SCSS enters through src/assets/js/main.js. Values come from CSS custom properties, not hex or px (except 1px / 2px hairlines).
Never edit _tokens.generated.scss. Change tokens/tokens.json and recompile.

package.json

    
{
  "name": "norio-html-dev",
  "version": "1.0.0",
  "description": "Norio master HTML source — Vite + Nunjucks + SCSS, no CSS framework",
  "private": true,
  "type": "module",
  "scripts": {
    "tokens": "node scripts/build-tokens.mjs",
    "predev": "npm run tokens",
    "dev": "vite",
    "prebuild": "npm run tokens",
    "build": "vite build",
    "preview": "vite preview",
    "lint:fse": "node scripts/check-fse-ready.mjs"
  },
  "devDependencies": {
    "nunjucks": "^3.2.4",
    "sass": "^1.85.0",
    "sharp": "^0.35.3",
    "vite": "^6.2.0"
  },
  "engines": {
    "node": ">=18"
  },
  "dependencies": {
    "gsap": "^3.15.0",
    "three": "^0.184.0"
  }
}

Note

Buyers who only need to edit copy or images can work in the compiled HTML package. Developers who want to add pages, restyle tokens, or keep the section architecture should work in norio-html-dev and run npm run build (or npm run build:html for the ThemeForest flat package) again.

For how to preview the compiled template locally (HTTP server vs file:// / Chrome), see Local Preview.