frontend icon indicating copy to clipboard operation
frontend copied to clipboard

webpack modules and fonts issues

Open bidi47 opened this issue 9 months ago • 1 comments

regarding https://github.com/dotkernel/frontend/blob/4.0/webpack.config.js

Make modules dynamic and add support for multiple modules

the appModules array supports multiple modules, so i propose these changes

from let entries = { app: [] }; to the below, since the initialization is not needed let entries = {};

and from

    appModules.forEach(function (appModule) {
        if (appModule.js === true) {
            entries.app.push(appModule.assets_path + '/js/index.js')
        }
        if (appModule.styles === true) {
            entries.app.push(appModule.assets_path + '/scss/index.scss')
        }
        if (appModule.images === true) {
            copyImages.push({from: appModule.assets_path + '/images', to: './images/' + appModule.name});
    
            rules.push({
                test: /\.(png|svg|jpg|gif)$/,
                include: [
                    path.resolve(__dirname, './src/' + appModule.assets_path)
                ],
                use: [
                       {loader: 'file-loader'}
                ]
            })
        }
    });

to the below, note the use of appModule.name that uses the module name(s) dynamically

    appModules.forEach(function (appModule) {
        entries[appModule.name] = [];
        if (appModule.js === true) {
            entries[appModule.name].push(appModule.assets_path + '/js/index.js')
        }
        if (appModule.styles === true) {
            entries[appModule.name].push(appModule.assets_path + '/scss/index.scss')
        }
        if (appModule.images === true) {
            copyImages.push({from: appModule.assets_path + '/images', to: './images/' + appModule.name});
    
            rules.push({
                test: /\.(png|svg|jpg|gif)$/,
                include: [
                    path.resolve(__dirname, 'src/' + appModule.assets_path)
                ],
                use: [
                    {loader: 'file-loader'}
                ]
            })
        }
    });

Fonts are not copied

this section of the code should work on copying the fonts to the public directory, but fails to do so

    {
        test: /\.(woff|woff2|eot|ttf|otf|svg)$/,
        exclude: [/images?|img/],
        use: [
            // As SVG may count as both font or image
            // we will not treat any file in a folder
            // with the name image(s) or img as a font
            'file-loader?name=fonts/[name].[ext]'
        ]
    }

bidi47 avatar May 28 '24 10:05 bidi47