What is this ?

"project2501" is @dollplayer2501's portal site.

• One page website
• Site template is Eventually in HTML5 UP!.
• Back end system is Eleventy and Gulp.
  • Eleventy
    • @11ty/eleventy-plugin-directory-output plugin
    • html-minifier
  • Gulp
    • gulp-dart-sass with gulp-sourcemaps
    • gulp-terser with gulp-sourcemaps
    • gulp-webp with lastrun
    • gulp-mode
    • gulp-if
  • npm scripts
    • cross-env
    • npm-run-all
    • rimraf
    • npm-check-updates
    • npm serve
  • Node.js versioning assumes the use of rtx

Getting started

1. git clone

git clone [email protected]:dollplayer2501/project2501-v2.git any-path-name
cd any-path-name

2. Check the Node.js version if necessary

For example in my case. (I use rtx)

rtx activate fish | source

Refer to .rtx.toml for the current version used.

3. Npm and package install

npm install

4. Start up

Check my package.json's scripts section.

4.1 Build and/or watch locally

Output is stored in ./any-path-name/_develop.
URL is http://localhost:8080 (default).

npm run develop:watch

If you only need to build, use the following.

npm run develop:build

4.2. Build a product version and visual confirmation

Output is stored in ./any-path-name/_product.
HTML, JavaScript and CSS are compressed.

npm run product:build

If you want to visually check using a web browser, please see below.
URL is http://localhost:3000 (default).

npm run product:serve

Memo

• Automatic reloading after compiling Sass/SCSS doesn't work?
  Do I need to reload manually?
• Locally, I use the automatic reload feature of 11ty/Eleventy, but in production I use npm serve.

//