Component Bundles

A component bundle contains a component or an app and all its related resources.
Resource Resource Name Usage See Also
Component or Application sample.cmp or sample.app The only required resource in a bundle. Contains markup for the component or app. Each bundle contains only one component or app resource. Creating Components

aura:application

CSS Styles sample.css Contains styles for the component. CSS in Components
Controller sampleController.js Contains client-side controller methods to handle events in the component. Handling Events with Client-Side Controllers
Design sample.design File required for components used in Lightning App Builder, Lightning pages, or Community Builder. Configure Components for Lightning Pages and the Lightning App Builder
Documentation sample.auradoc A description, sample code, and one or multiple references to example components Providing Component Documentation
Renderer sampleRenderer.js Client-side renderer to override default rendering for a component. Create a Custom Renderer
Helper sampleHelper.js JavaScript functions that can be called from any JavaScript code in a component’s bundle Sharing JavaScript Code in a Component Bundle
SVG File sample.svg Custom icon resource for components used in the Lightning App Builder or Community Builder. Configure Components for Lightning Pages and the Lightning App Builder

All resources in the component bundle follow the naming convention and are auto-wired. For example, a controller <componentName>Controller.js is auto-wired to its component, which means that you can use the controller within the scope of that component.