Skip to main content

assets

Importing Assets​

CDEBase is a webpack-based project, so it follows the general approach to importing assets — [webpack dependency management]. You can look up the module packages/assets to see how assets are imported.

As you can see in the code sample below, the project imports all the assets from the modules/favicon/common/assets folder:

const exportedAssets = {};
let isbrowser= typeof window !== 'undefined'
if (isbrowser) {
// Favicon.ico should not be hashed, since browsers expect it to be exactly on /favicon.ico URL
require('!file-loader?name=[name].[ext]!./assets/favicon.ico'); // eslint-disable-line

// Require all files from assets dir recursively adding them into assets.json
const req = require.context('!file-loader?name=[hash].[ext]!./assets', true, /.*/);
req.keys().map((key) => {
    exportedAssets[`${key.replace('./', '')}`] = req(key);
});
}

export default exportedAssets;

To use new assets in your client side react code, import from the favicon package as follows:

import assets from '@admin-layout/assets';
console.log('--ASSETS', assets);

export const Favicon = <img src={assets['favicon.ico']} />
image