Добрый день всем! Есть проблема, и никак не могу найти решения, т.к. давно уже напрямую дело с настройкой webpack'ом не имел.
Приходят ошибки от пользователей с портала, где подключены мои виджеты написаные на React. К примеру:
{
"message": "Loading chunk 0 failed.",
"stack": "Error: Loading chunk 0 failed.\n at HTMLScriptElement.n (http://<мой урл>/widget/media/index.js:2:500)"
}
а иногда приходит и такая ошибка, скажем с другого поддомена третьего уровня, где так же располагаются виджеты
{
"message": "Loading chunk 1 failed.",
"stack": "Error: Loading chunk 1 failed.\n at HTMLScriptElement.n (http://<мой урл>/widget/media/index.js:2:500)"
}
Обновляется на продакшене это по такой цепочке: вначале на сервере запускается команда build:prod которая в пэкейдже вот такая "build:prod": "npm run lint && npm test && webpack --config webpack.config.prod.js"
, затем сам webpack.config.prod.js, который в свою очередь содрежит в себе вот такой код
const webpack = require('webpack');
const path = require('path');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const pkg = require('./package.json');
module.exports = {
entry: {
index: path.join(__dirname, 'src', 'index.js')
},
output: {
path: path.join(__dirname, 'build'),
filename: '[name].js',
chunkFilename: '[name].js',
publicPath: '/widget/media/'
},
module: {
rules: [
{
test: /\.jsx?$/,
exclude: /node_modules/,
use: 'babel-loader'
},
{
test: /\.(png|jpg)$/,
use: 'file-loader?name=img/[name].[ext]'
},
{
test: /\.css$/,
loader: ExtractTextPlugin.extract({
fallback: 'style-loader',
use: [
{
loader: 'css-loader',
options: {
sourceMap: false,
modules: true,
minimize: true,
localIdentName: '[hash:base64:7]'
}
},
'postcss-loader'
]
})
}
]
},
plugins: [
new ExtractTextPlugin('styles.css'),
new webpack.NoEmitOnErrorsPlugin(),
new webpack.optimize.UglifyJsPlugin({
compress: { warnings: false },
comments: false
}),
new webpack.BannerPlugin(`${pkg.name}-${new Date()}. RELEASE.`),
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: JSON.stringify('production')
},
PROJECT_ENV: JSON.stringify('production')
})
]
};
В самом файле index.js, который располагается в папке src, который указан как entry index у меня такой код
import 'babel-polyfill';
import datasetPolyfill from 'element-dataset';
import React from 'react';
import { render } from 'react-dom';
import { Provider } from 'react-redux';
import store from './store';
import Orders, { initAction } from './features/orders';
import Returns, { initAction as returnInit } from './features/returns';
datasetPolyfill();
const features = {
orders: {
root: Orders,
init: initAction
},
returns: {
root: Returns,
init: returnInit
}
};
const containers = Array.from(document.querySelectorAll('[data-feature]'));
containers.forEach(container => {
const Feature = features[container.dataset.feature];
if (Feature) {
store.dispatch(Feature.init(JSON.parse(container.dataset.state)));
render(
<Provider store={store}>
<Feature.root />
</Provider>,
container
);
}
});
В этом коде, я нахожу все мои фичи со спец якорем. Далее, в файле import Orders, { initAction } from './features/orders' у меня вот такой код
import errorAction from 'rossko-orders/lib/actions/error';
import AsyncComponent from '../../components/async-wrap';
function importFunc() {
return import(/* webpackChunkName: "orders" */ 'rossko-orders');
}
export initAction from 'rossko-orders/lib/actions/init';
export default AsyncComponent(importFunc, errorAction);
Тоже самое у меня и с import Returns, { initAction as returnInit } from './features/returns';
Судя по тому какой вал ошибок, происходит это не у всех пользователей, а только лишь у какой-то части. Более того, на тестовом окружении таких ошибок небыло вообще.
Сперва были подозрения, что происходит это только на старых браузерах, типа IE или на мобилках, но оказалось, что это не так и происходит на не старых браузерах.
Headers: Cache-Control: no-cache; Connection: close; Pragma: no-cache; Content-Type: application/json; Accept: application/json, text/plain, */*; Accept-Encoding: gzip, deflate, br; Accept-Language: ru,en;q=0.8; Cookie: ym_uid=149837534368628556; ga=GA1.2.1338437862.1512111490; _gid=GA1.2.386643296.1513581524; Host: returns; Referer: http://< url >/personal/orders/; User-Agent: Mozilla/5.0 (Windows NT 5.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/57.0.2987.137 YaBrowser/17.4.1.1026 Yowser/2.5 Safari/537.36; Origin: http://< url >; Content-Length: 162; Authorization-Domain: http://< url >; Authorization-Session: < сессия >.
{
"message": "Loading chunk 0 failed.",
"stack": "Error: Loading chunk 0 failed.\n at HTMLScriptElement.n (http://< url >/widget/media/index.js?:2:500)"
}
Я в тупике и не знаю в чем причина и как ее исправить. Поэтому любая помощь будет ценной и полезной.
Айфон мало держит заряд, разбираемся с проблемой вместе с AppLab
Перевод документов на английский язык: Важность и ключевые аспекты
Доброго времениПри работе с сайтом через ftp иногда приходится чистить кэш что бы увидеть результат, чаще всего это требуется если добавил...
Обычно в литературе для доступа к элементу рекомендуют использовать documentgetElementById("id_")
Суть такаяПросто жму на кнопку "next", запускается цикл, цикл перебирает элементы