Set up your environment

Part of the Getting Started with Infusion Component Design Tutorial

Set Up Directory Structure

For this tutorial we'll assume this component is being created for your own use, not as a contribution to Infusion. If you do want to contribute your component to Infusion, the directory set-up and requirements will be a little different and is explained in Contributing Code.

Let's suppose you're creating a component that will carry out currency conversion. You'll need to get a copy of Infusion:

• Download the latest release of Fluid Infusion and unpack it (or check out the main branch for the very latest, unreleased version).
• Follow the instructions in the Readme file to create your Infusion package.
• The build process places the output in a .zip file in the "products" folder. Unpack that archive and place the resulting "infusion" folder in a "lib" folder in your source hierarchy.

So supposing your project is in a folder called "converter," your source hierarchy might look like this:

• converter
  • src
• lib
  • infusion

All of the Infusion JavaScript is in a single file in the "infusion" folder called infusion-all.js (unless you provided custom options to your grunt command). You will need to link to this file in your HTML headers.

Next: Define a namespace and create a closure