In the index.js
file within the 06-build-page
directory, develop a script that:
- Creates a folder named
project-dist
. - Replaces template tags in the
template.html
file with filenames from thecomponents
folder (e.g.,{{section}}
) with the contents of the components of the same name and saves the result inproject-dist/index.html
. - Compiles styles from the
styles
folder into a single file and places it inproject-dist/style.css
. - Copies the
assets
folder intoproject-dist/assets
.
- The use of any third-party modules is prohibited.
- Each task must be executed in the root directory using the command
node <task folder name>
. - The use of synchronous functions from the fs module, such as
fs.statSync(path[, options])
,fs.readFileSync(path[, options])
, and others found in the synchronous API section, is prohibited.
- After the script execution terminates, the
project-dist
folder should be created. - The
project-dist
folder should contain filesindex.html
andstyle.css
. - The
project-dist
folder should contain anassets
folder that is an exact copy of theassets
folder in06-build-page
. - The use of
fsPromises.cp()
is prohibited. - The
index.html
file should contain markup resulting from the replacement of template tags in thetemplate.html
file. - The
style.css
file should contain styles compiled from files in thestyles
folder. - When adding a component to the folder and the corresponding tag to the original
template.html
file, rerunning the script should update theindex.html
file in theproject-dist
folder. Thestyle.css
file andassets
folder should also maintain an up-to-date state. - When writing two or more template tags consecutively in the
template.html
file, separated only by spaces without line breaks, there should be no code execution errors. For example,{{about}} {{articles}}
should be interpreted as two separate components. - The original
template.html
file should not be modified during script execution. - Writing content to the template from any files except those with the
.html
extension is an error.
- Create a small utility to assemble a static HTML page.
- Reinforce acquired knowledge.
Possible steps to complete the task:
- Import all required modules.
- Read and save the template file in a variable.
- Find all tag names in the template file.
- Replace template tags with the content of component files.
- Write the modified template to the
index.html
file in theproject-dist
folder. - Use the script written in task 05-merge-styles to create the
style.css
file. - Use the script from task 04-copy-directory to move the
assets
folder into theproject-dist
folder.
Note that you can optimize and modify this algorithm according to your preferences.