--- source: https://qlik.dev/extend/build-extension/extensions-load-resources/ last_updated: 2025-07-08T16:09:30Z --- # Load resources You can use different types of resources in your visualization extensions, for example: - Style sheets / CSS files - JavaScript libraries - Images - Fonts - Items from the content library Qlik Sense loads resources asynchronously using RequireJS. ## Loading resources asynchronously using RequireJS Qlik Sense uses RequireJS to take care of the asynchronous loading of resources. ```javascript define( [ /* dependencies */ ], ( /* returned dependencies as arguments */ ) => { ... } ); ``` jQuery is pre-configured as an internal dependency of Qlik Sense so there is no need to explicitly load jQuery. By defining the dependency in the first parameter of the `define` function, you ensure jQuery is loaded and that the return value of this library will be passed as the first parameter in the function (the second argument of `define`). Loading the predefined dependency of jQuery looks like the following: ```javascript define( [ "jquery" ], ( $ ) => { 'use strict'; return { paint: ( $element, layout ) => { // We can use jQuery here console.log($('head')); } }; } ); ``` ## Style sheets / CSS files There are several ways of loading style sheets into your visualization extension: - Loading and adding the content of a CSS file to the document header - Adding a link to a style sheet to the document header - Using the RequireJS CSS plugin > **Note:** Make sure to prevent conflicts between existing styles or style definitions from other visualization extensions when > you are creating style sheets. > For more information, see [Style your visualizations](https://qlik.dev/extend/build-extension/working-with-styling/). > **Tip:** It is good programming practice to keep your styling in a separate CSS file. > Separating the content from the design makes it easier to maintain your visualizations. > Qlik Sense sets the CSS class `qv-object-[extension name]` on your visualizations and your CSS rules should be > prefixed with that. ### Loading and adding the content of a CSS file to the document header You can use RequireJS and the `text!` prefix in the `define` statement to inject the content into the header of the current document. Qlik Sense includes the RequireJS plugin for loading text resources, which can be used to load a specific CSS file. Assuming you have the following file structure: [image: UI extensions get started file structure] When prefixing a path with `text!`, the text plugin loads a file and passes its content to a variable. ```javascript define( [ 'jquery', 'text!./css/myStyle.css' ], ( $, cssContent ) => { // cssContent now contains the content of myStyle.css // Inject the CSS declarations into the header of the current document $( '