Gulp
Introduction
<p class="mt-4">The <code>gulp</code> command will build, serve and watch the project with the following gulp tasks:</p>
The gulp
command will build, serve and watch the project with the following gulp tasks:
Commands
<div class="table-responsive scrollbar">
<table class="table table-bordered">
<thead class="text-center">
<tr>
<th class="text-nowrap">Task</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<tr>
<td class="text-nowrap ps-3"><code>clean</code></td>
<td>Delete the following directories:
<pre><code class="lang-html">public/assets/css
public/assets/js
public/vendors // packages which are included in vendors.json
public/**/*.html
</code></pre>
</td>
</tr>
<tr>
<td class="text-nowrap ps-3"><code>style</code></td>
<td>Compiles <code>scss/theme.scss</code> and generates <code>theme.css, theme.min.css, theme-rlt.css, theme-rtl.min.css</code> and <code>theme.css.map, theme.min.css.map, theme-rlt.css.map, theme-rtl.min.css.map</code> to the <code>public/assets/css/ </code> directory.</td>
</tr>
<tr>
<td class="text-nowrap ps-3"><code>script</code></td>
<td>Concat the <code>js</code> files from <code>src/js/</code> and transpiles with babel to <code>phoenix.js</code> to the <code>public/assets/js/</code> directory.</td>
</tr>
<tr>
<td class="text-nowrap ps-3"><code>compile:all</code></td>
<td>Compiles all the <code>js, </code><code>scss, </code><code>pug </code>files from the <code>src</code> directory.</td>
</tr>
<tr>
<td class="text-nowrap ps-3"><code>vendor</code></td>
<td>Runs <code>vendor:clean</code> and <code>vendor:move</code> in series.</td>
</tr>
<tr>
<td class="text-nowrap ps-3"><code>vendor:clean</code></td>
<td>Delete the vendors from <code>public/vendors</code> directory which are included in <code>vendors.json</code>.</td>
</tr>
<tr>
<td class="text-nowrap ps-3"><code>vendor:move</code></td>
<td>Copies the vendors from <code>node_modules/</code> directory to <code>public/vendors</code> directory according to the <code>vendors.json</code>.</td>
</tr>
<tr>
<td class="text-nowrap ps-3"><code>watch</code></td>
<td>All of the following folders are monitored for changes, which will tell the browser to reload automatically after any changes are made:
<pre><code class="lang-html">public/assets/img
public/assets/fonts
public/assets/video
public/vendors/
src/pug
src/scss
src/js</code></pre>
</td>
</tr>
<tr>
<td class="text-nowrap ps-3"><code>build</code></td>
<td>Will delete previous build directory and generate a new compressed version to deploy
<pre><code class="lang-html">build/assets/img
build/assets/fonts
build/assets/video
build/assets/css
build/assets/js
build/vendors/
build/**/*.html</code></pre>
</td>
</tr>
<tr>
<td class="text-nowrap ps-3"><code>build:test</code></td>
<td>Will run the build version in port:3000</td>
</tr>
</tbody>
</table>
</div>