frontend
frontend copied to clipboard
webpack modules and fonts issues
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]'
]
}