Fliqs template is developer-friendly and contains source files + gulp tasks.
Make sure, that we will not help you with any troubles that you faced with source builds, so if you don’t have any experience with npm
, gulp
and webpack
, please first learn more about these tools. These sources only for developers.
Requirements
- Node.js and npm – https://nodejs.org/en/
Getting started
- Unzip downloaded template and open
/fliqs/
folder - Install node modules by running the terminal command
npm install
- Start development using
npm run dev
- For build production files use
npm run production
(don’t forget to change the production config inpackage.json
)
dev
and production
tasks will build files to /dist/
folder.
Configure Production Task
All production configurations placed in package.json
. How it looks by default:
- Google Analytics code for automatic integration
- Protection script, that will throw alert automatically, if someone downloads your website code and try to run it on a different domain
You may also disable these configurations, so your code will look like this:
Configure HTML
Configurations for HTML files places in /src/html/data/global.json
Troubleshooting
Sometimes, when you run dev the task, you will only see a white screen in your browser preview. In most cases, this is easily resolved when you install PHP in your system. But sometimes it is not working, and you need to customize the browserSync
task manually. To customize it, follow these steps:
- Open
gulpfile.babel.js
file in your code/text editor - Find this code part:
$.connectPhp.server(gulpConfig.php, () => { browserSync(gulpConfig.browserSync); });
- And change it to this one:
browserSync.init({ server: { baseDir: gulpConfig.php.base, open: true, notify: false, }, });