Build Tools

Learn how to use Luma HTML's included Build Tools to compile the SCSS and JavaScript source files, if and when you need to customize them.

Setup

  1. Install Node.js and NPM: Download Node.js from https://nodejs.org/en/download/ and install it on your system. NPM comes bundled with Node.js.
  2. Install npm packages: In your terminal, go to your luma-bootstrap-html/ root directory and run npm install. NPM will download all the dependencies under node_modules folder.

Resources

The resources/ directory contains the main application SCSS and JavaScript — un-compiled source assets.

  1. JavaScript: edit resources/js and compile to public/js
  2. SCSS: edit resources/sass and compile to public/css

Running development server

Run the following command to start the development server and access http://localhost:3000/Demos/App_Layout/index.html to run your project in browser. The browser will automatically reload if you change any of the files in public or any of the HTML files.

Production build

Run the following command to build public/js and public/css files for production with webpack and minify the JS & CSS.

Custom build

Edit webpack.mix.js to customize the build. Learn more about Laravel Mix, about the usage and available options at https://laravel-mix.com.

Troubleshooting

Unfortunately, there are countless reasons why your dependencies may not be installing properly. A common root relates to an ancient version of Node (node -v) and npm (npm -v) installed. As a first step, visit https://nodejs.org/en/download/ and update those.

Otherwise, often, it's related to a faulty lock file that needs to be deleted. Give this series of commands a try to install everything from scratch: