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:

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.

Note: The "infusion" folder actually contains some files you don't need, but it's not required to remove them, so we won't worry about that right now.

Next: Define a namespace and create a closure