I have a CSS file in the resources/css directory of my Ext JS package. Nevertheless package-all.css is empty after the sencha package build.
How can I make Sencha put the CSS file's contents into package-all.css? It should finally be copied to the all.css file of the app that uses the package.
You have to add it to package.json as a resource.
/**
* Extra resources to be copied along when build
*/
"resources": [
"resources/css/app.css",
"resources/images",
"resources/static",
"resources/libs",
"resources/translations"
],
or even better as a css file.
/**
* List of all CSS assets in the right inclusion order.
* Each item is an object with the following format:
* {
* "path": "path/to/item.css" // Path to file, if local file it must be relative to this app.json file
* "remote": true // (Optional)
* // - Defaults to undefined (falsey) to signal a local file which will be copied
* // - Specify true if this file is a remote file which will not to be copied
* "update": "delta" // (Optional)
* // - If not specified, this file will only be loaded once, and
* // cached inside localStorage until this value is changed to either one below
* // - "delta" to enable over-the-air delta update for this file
* // - "full" means full update will be made when this file changes
*
* }
*/
"css": [
{
"path": "resources/libs/Arcgis v3.11/arcgis311.css",
"remote": true
},
{
"path": "resources/css/app.css",
"remote": true
}
]
You can include it directly to index.html. Its working fine in build as well.`
<title>xxxxx</title>
<!-- The line below must be kept intact for Sencha Cmd to build your application -->
<link type='text/css' rel='stylesheet' href='resources/custom/css/my_css.css' />
<link type='text/css' rel='stylesheet' href='resources/fonts/font-awesome-4.3.0/css/font-awesome.css' />
<script id="microloader" type="text/javascript" src="bootstrap.js"></script>
`
Inspired by Tarabass' answer, I added my CSS file in package.json inside the package. Now it is used by the app.
"css": [{
path: "resources/css/styles.css"
}],
package.json instead of app.json. I will edit my answer to be more precise for future users who want to accomplish the same.