---
schema_version: "1"
id: 983f49f45c03f431d3a229276a6cd7907da7f1999f401b0cb1ace5edd7e872ef
title: Component Bundles
collection: developer
version: current
locale: en-us
portal_url: https://docs.salesforce.com/developer/current/en-us/platform/aura-platform/guides/aura/components/components-bundle.md
canonical_url: https://developer.salesforce.com/docs/platform/aura-platform/guide/components-bundle.html
source_site: developer.salesforce.com
content_type: documentation
content_hash: 26dc78fc4d078f36fbb8873bbfe09709426fa1a1483a2824c1ae6b6706569b6c
products:
  - Lightning Aura Components Developer Guide
  - Platform Developer Content
---

# 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](https://developer.salesforce.com/docs/platform/aura-platform/guide/components-overview.md)[aura:application](https://developer.salesforce.com/docs/platform/aura-platform/ref/ref-aura-application.md)|
|CSS Styles|sample.css|Contains styles for the component.|[CSS in Components](https://developer.salesforce.com/docs/platform/aura-platform/guide/components-css.md)|
|Controller|sampleController.js|Contains client-side controller methods to handle events in the component.|[Handling Events with Client-Side Controllers](https://developer.salesforce.com/docs/platform/aura-platform/js/js-client-side-controller.md)|
|Design|sample.design|File required for components used in Lightning App Builder, Lightning pages, Experience Builder, or Flow Builder.|[Aura Component Bundle Design Resources](https://developer.salesforce.com/docs/platform/aura-platform/guide/components-config-for-app-builder-design-files.md)|
|Documentation|sample.auradoc|A description, sample code, and one or multiple references to example components|[Writing Documentation for the Component Library](https://developer.salesforce.com/docs/platform/aura-platform/docs/docs-intro.md)|
|Renderer|sampleRenderer.js|Client-side renderer to override default rendering for a component.|[Create a Custom Renderer](https://developer.salesforce.com/docs/platform/aura-platform/js/js-renderers.md)|
|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](https://developer.salesforce.com/docs/platform/aura-platform/js/js-helper.md)|
|SVG File|sample.svg|Custom icon resource for components used in the Lightning App Builder or Experience Builder.|[Configure Components for Lightning Pages and the Lightning App Builder](https://developer.salesforce.com/docs/platform/aura-platform/guide/components-config-for-app-builder.md)|

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.

Each resource, such as a cmp, css, or js file, in an Aura component bundle has a maximum file size of 1,000,000 bytes. However, for performance reasons, we recommend that you don’t exceed a maximum file size of 128 KB (131,072 bytes).