...
- Before beginning, know where your project files will reside. We will build Infusion (which contains UI Options) and copy its files to your project directory.
- Install node.js by following the instructions on their website. node.js will give you access to npm which is a repository for Open Source projects and libraries. This is how we will get Infusion and the latest UI Options.
- In your project directory, create a sub-directory called "temp". We will use this to hold intermediate files which can be deleted once Infusion and UI Options is built.
- Now open a command line and change directories so you are located in the temp sub-directory in your project directory.
- On Windows:
- Launch Powershell: Go to Start, then "Run". Type "
powershell
" into the run text field and press Enter. - In the Powershell window, change directories to your project by typing "
cd ~\Desktop\my-project\temp
" (without the quotes) and pressing Enter.
- Launch Powershell: Go to Start, then "Run". Type "
- On Mac:
- Launch Terminal: Go to Spotlight Search (the magnifying glass in the top-right corner), search for "
Terminal
", and then press Enter. - In the Terminal window, change directories to your project by typing "
cd ~/Desktop/my-project/temp
" (without the quotes) and pressing Enter.
- Launch Terminal: Go to Spotlight Search (the magnifying glass in the top-right corner), search for "
- On Windows:
- Install grunt by typing in the command line "
npm install -g grunt-cli
"- On MacOS, if you get an "
Error: EACCESS: Permission denied...
" message, you may have to run "sudo npm install -g grunt-cli
" instead. You will have to enter your computer password to proceed with installing grunt.
- On MacOS, if you get an "
- You are now ready to proceed to Part 2.
Sample Mac OS Command LineTerminal:
Code Block | ||
---|---|---|
| ||
mkdir ~/Desktop/my-project/temp cd ~/Desktop/my-project/temp sudo npm install -g grunt-cli |
Sample Windows Poweshell:
Code Block | ||
---|---|---|
| ||
md ~\Desktop\my-project\temp
cd ~\Desktop\my-project\temp
npm install -g grunt-cli |
Part 2: Getting and Building Infusion
...
- Get Infusion by typing "
npm install infusion
" in the command line and pressing Enter. The process will run and a new directory callednode_modules
will be created as a result. - Using the command line, change directory into the infusion directory that's been created within
node_modules
.- On Windows type: "
cd node_modules\infusion
" (without quotes) and press Enter. - On Mac type: "
cd node_modules/infusion
" (without quotes) and press Enter.
- On Windows type: "
- Now build Infusion by typing "
npm install
" (without quotes) and press Enter. Once that is done, type "grunt
" without quotes and press Enter. This will create a "products
" directory in the Infusion directory. - Within the
my-project/temp/node_modules/infusion/products
directory, there is now a ZIP file called "infusion-all-2.0.0.zip
" (the exact filename may be a little different depending on the release of Infusion available at the time you download it). Unzip this file using your preferred Unzipping program. - Now copy (or move) the resulting "
infusion
" directory into your project's root directory.
Sample Mac OS Command LineTerminal:
Code Block | ||
---|---|---|
| ||
npm install infusion cd node_modules/infusion/ npm install grunt cd products unzip infusion-all-2.0.0.zip mv infusion ~/Desktop/my-project/ |
Code Block | ||
---|---|---|
| ||
npm install infusion
cd node_modules\infusion\
npm install
grunt
cd products
unzip infusion-all-2.0.0.zip
mv infusion ~\Desktop\my-project\ |
At this point your project directory should look something like this:
...