I have the following config for my webpack:
var path = require('path');
var webpack = require('webpack');
var config = {
entry: {
login: path.join(__dirname, 'src' , 'entry' , 'login.js'),
register: path.join(__dirname, 'src', 'entry', 'register'),
faqLogged: path.join(__dirname, 'src', 'entry', 'faqLogged'),
content: path.join(__dirname, 'src', 'entry', 'content'),
},
output: {
path: path.join(__dirname, 'build'),
filename: '[name].js',
},
module: {
loaders: [
{
test: /.jsx?$/,
loader: 'babel-loader',
exclude: /node_modules/,
query: {
presets: ['es2015', 'react']
}
}
]
},
}
module.exports = config;
In my app I use AJAX and I ought use babel-loader. The problem is, if I use the cdnjs for babel-loader, and therefore no import
statements in my app, the page loads almost instantly.
On the other hand, if I use webpack to bundle my page, now being able to use import
, and doing so, will result in my page load time being over 4 seconds and I receive the following error in my browser's console ( Chrome ) :
[BABEL] Note: The code generator has deoptimised the styling of "http://localhost/build/content.js" as it exceeds the max of "100KB".
I have tried to minify the bundled file but that does not seem to be the issue. The fact that it has over 100kb doesn't bother me, what does is the absurd load time.