I have an issue with the production build of my app, the dev build is working fine, but when I run the production build it fails with the following error
cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --config=node_modules/laravel-mix/setup/webpack.config.js
CssSyntaxError: /css/app.css:39524:3: Unknown word
at Input.error (/Users/vladimirgatev/Sites/localhost/SP6/node_modules/postcss/lib/input.js:128:16)
at Parser.unknownWord (/Users/vladimirgatev/Sites/localhost/SP6/node_modules/postcss/lib/parser.js:561:22)
at Parser.decl (/Users/vladimirgatev/Sites/localhost/SP6/node_modules/postcss/lib/parser.js:233:16)
at Parser.other (/Users/vladimirgatev/Sites/localhost/SP6/node_modules/postcss/lib/parser.js:164:12)
at Parser.parse (/Users/vladimirgatev/Sites/localhost/SP6/node_modules/postcss/lib/parser.js:75:16)
at parse (/Users/vladimirgatev/Sites/localhost/SP6/node_modules/postcss/lib/parse.js:17:12)
at new LazyResult (/Users/vladimirgatev/Sites/localhost/SP6/node_modules/postcss/lib/lazy-result.js:64:16)
at Processor.<anonymous> (/Users/vladimirgatev/Sites/localhost/SP6/node_modules/postcss/lib/processor.js:142:12)
at Processor.process (/Users/vladimirgatev/Sites/localhost/SP6/node_modules/postcss/lib/processor.js:121:23)
at Function.creator.process (/Users/vladimirgatev/Sites/localhost/SP6/node_modules/postcss/lib/postcss.js:148:43)
at OptimizeCssAssetsWebpackPlugin.processCss (/Users/vladimirgatev/Sites/localhost/SP6/node_modules/optimize-css-assets-webpack-plugin/src/index.js:73:21)
at Object.processor (/Users/vladimirgatev/Sites/localhost/SP6/node_modules/optimize-css-assets-webpack-plugin/src/index.js:13:18)
at /Users/vladimirgatev/Sites/localhost/SP6/node_modules/last-call-webpack-plugin/src/index.js:150:10
at arrayEach (/Users/vladimirgatev/Sites/localhost/SP6/node_modules/lodash/_arrayEach.js:15:9)
at forEach (/Users/vladimirgatev/Sites/localhost/SP6/node_modules/lodash/forEach.js:38:10)
at OptimizeCssAssetsWebpackPlugin.process (/Users/vladimirgatev/Sites/localhost/SP6/node_modules/last-call-webpack-plugin/src/index.js:147:5)
at /Users/vladimirgatev/Sites/localhost/SP6/node_modules/last-call-webpack-plugin/src/index.js:178:28
at _next0 (eval at create (/Users/vladimirgatev/Sites/localhost/SP6/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:9:17)
at eval (eval at create (/Users/vladimirgatev/Sites/localhost/SP6/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:27:1)
at processTicksAndRejections (internal/process/task_queues.js:93:5)
I noticed that there is a javascript at the end of the app.css
/* (ignored) *//* (ignored) *//* (ignored) *//* (ignored) *//* (ignored) *//* (ignored) */var map = {
"./Products": [
"./frontend/src/views/apps/orders/orders-add/templates/Products.vue",
2,
9,
17
],
"./Products.vue": [
"./frontend/src/views/apps/orders/orders-add/templates/Products.vue",
2,
9,
17
],
"./Shops": [
"./frontend/src/views/apps/orders/orders-add/templates/Shops.vue",
7
],
"./Shops.vue": [
"./frontend/src/views/apps/orders/orders-add/templates/Shops.vue",
7
],
"./Stage": [
"./frontend/src/views/apps/orders/orders-add/templates/Stage.vue",
2,
4,
3,
5,
10,
16
],
"./Stage.vue": [
"./frontend/src/views/apps/orders/orders-add/templates/Stage.vue",
2,
4,
3,
5,
10,
16
]
};
function webpackAsyncContext(req) {
if(!__webpack_require__.o(map, req)) {
return Promise.resolve().then(function() {
var e = new Error("Cannot find module '" + req + "'");
e.code = 'MODULE_NOT_FOUND';
throw e;
});
}
var ids = map[req], id = ids[0];
return Promise.all(ids.slice(1).map(__webpack_require__.e)).then(function() {
return __webpack_require__(id);
});
}
webpackAsyncContext.keys = function webpackAsyncContextKeys() {
return Object.keys(map);
};
webpackAsyncContext.id = "./frontend/src/views/apps/orders/orders-add/templates lazy recursive ^\.\/.*$";
module.exports = webpackAsyncContext;
I think it is something related to dynamic imports of modules, but I do not know how to fix that.
laravel-mix version 5.0.1
webpack version: 4.46.0