
What are source, compiled and static files?
It simply means that when you edit source files, after they are recompiled, your browser will magically refresh and display the changes without a manual refresh.
Live reload is a convenience functionality that many themes will include as part of their build tooling. This avoids browser limitations of serving files directly from your computer’s filesystem (i.e. A local server is a temporary server environment on your computer generated by your theme’s build tool. They all achieve the same result end result: allow us to compile source files and view those changes immediately in a browser. Each library has different syntax and capabilities and it’s up to each author which library they prefer to use. Gulp, Grunt, and Webpack (build tools) are JavaScript libraries used to compile a theme’s source files and create a local server. Npm is a tool to automate the process of installing and upgrading packages of code required to properly run your theme locally – that’s why they’re called dependencies! If you don’t have Node installed (which now contains npm), you’ll need to download and install it. If the list above sounds like a foreign language to you, that’s okay! Let’s break it down: Edit source files and preview changes instantly with live reload.
Open your browser to your local server’s address (i.e.Run a "watch" or "build" command powered by Gulp, Grunt, or Webpack build tools.Install a theme’s dependencies from your command line via npm.We allow each theme creator to select their own tooling and commands since each theme has different needs, so always to refer to your theme’s documentation for the actual commands and installation instructions.That said, the basic process of setting up local development is roughly the same in every theme:
Note: Some themes come with a directory of already compiled files for your convenience, but you’ll still want to run your theme’s build tool to serve the compiled files and avoid your local filesystem’s limitations.