0
В приложении React/Redux, используя Webpack Я получаю этот TypeError при попытке выполнить горячую перезагрузку (первый раз работает, но я получаю сообщение об ошибке ниже и после этого перестает работать).React HMR failing: modules [moduleId] .call не является функцией
Приложение основано на этом стартовом наборе: https://github.com/davezuko/react-redux-starter-kit/tree/v1.0.1, но я предполагаю, что некоторое обновление библиотеки сломало что-то.
Ошибка:
React Transform HMR] There was an error updating /www/src/containers/Root.js
index.js:60 TypeError: modules[moduleId].call is not a function(…)
Полностью раздели версия приложения ревом, но все-таки ошибка в HRM.
Root файл (то есть это: https://github.com/davezuko/react-redux-starter-kit/blob/v1.0.1/src/containers/Root.js) получает маршруты, как это:
import React from 'react';
import { Route, IndexRoute, Redirect } from 'react-router';
import WelcomeLayout from 'layouts/WelcomeLayout/WelcomeLayout';
import NotFoundView from 'views/NotFoundView/NotFoundView';
export default (
<Route>
<Route component={WelcomeLayout} path='/'>
<IndexRoute component={NotFoundView} />
</Route>
<Redirect from='*' to='/'/>
</Route>
);
NotFoundView:
import React from 'react';
import { Link } from 'react-router';
export class NotFoundView extends React.Component {
render() {
return (
<div>
<h1>Page not found - 404!</h1>
<hr />
<Link to='/'>Back</Link>
</div>
);
}
}
export default NotFoundView;
package.json:
{
"name": "App",
"version": "0.0.1",
"description": "myApp",
"private": true,
"main": "index.js",
"engines": {
"node": ">=4.2.0",
"npm": "^3.0.0"
},
"scripts": {
"clean": "rm -rf dist",
"compile": "node -r dotenv/config --harmony bin/compile",
"lint": "eslint . ./",
"lint:fix": "npm run lint -- --fix",
"start": "better-npm-run start",
"dev": "better-npm-run dev",
"dev:nw": "npm run dev -- --nw",
"dev:no-debug": "npm run dev -- --no_debug",
"test": "better-npm-run test",
"test:dev": "npm run test -- --watch",
"deploy": "better-npm-run deploy"
},
"betterScripts": {
"dev": {
"command": "nodemon -r dotenv/config bin/server",
"env": {
"NODE_ENV": "development"
}
},
"deploy": {
"command": "npm run clean && npm run compile",
"env": {
"NODE_ENV": "production"
}
},
"start": {
"command": "node -r dotenv/config bin/server"
},
"test": {
"command": "node -r dotenv/config ./node_modules/karma/bin/karma start bin/karma.js",
"env": {
"NODE_ENV": "test"
}
}
},
"dependencies": {
"better-npm-run": "0.0.5",
"debug": "^2.2.0",
"dotenv": "^1.2.0",
"es6-promise": "^3.0.2",
"history": "^2.0.0-rc2",
"isomorphic-fetch": "^2.2.1",
"koa": "^2.0.0-alpha.3",
"koa-connect-history-api-fallback": "^0.3.0",
"koa-convert": "^1.2.0",
"koa-static": "^2.0.0",
"react": "^0.14.0",
"react-bootstrap": "^0.28.2",
"react-dom": "^0.14.0",
"react-redux": "^4.0.0",
"react-router": "^2.0.0-rc5",
"redux": "^3.0.0",
"redux-actions": "^0.9.0",
"redux-simple-router": "^2.0.2",
"redux-thunk": "^1.0.0",
"url": "^0.11.0",
"yargs": "^3.18.0"
},
"devDependencies": {
"babel-core": "^6.3.17",
"babel-eslint": "^5.0.0-beta6",
"babel-loader": "^6.2.0",
"babel-plugin-add-module-exports": "^0.1.1",
"babel-plugin-transform-runtime": "^6.3.13",
"babel-preset-es2015": "^6.3.13",
"babel-preset-react": "^6.3.13",
"babel-preset-react-hmre": "^1.0.0",
"babel-preset-stage-0": "^6.3.13",
"babel-register": "^6.3.13",
"babel-runtime": "^6.3.19",
"chai": "^3.4.1",
"chai-as-promised": "^5.1.0",
"css-loader": "^0.23.0",
"cssnano": "^3.3.2",
"eslint": "^1.10.3",
"eslint-config-standard": "^4.4.0",
"eslint-config-standard-react": "^1.2.1",
"eslint-loader": "^1.1.1",
"eslint-plugin-babel": "^3.0.0",
"eslint-plugin-react": "^3.14.0",
"eslint-plugin-standard": "^1.3.1",
"extract-text-webpack-plugin": "^1.0.0",
"fetch-mock": "^4.0.1",
"fetch-mock-forwarder": "^1.0.0",
"file-loader": "^0.8.4",
"fs-extra": "^0.26.3",
"html-webpack-plugin": "^1.6.1",
"isparta-loader": "^2.0.0",
"json-loader": "^0.5.4",
"karma": "^0.13.8",
"karma-chai": "^0.1.0",
"karma-chai-as-promised": "^0.1.2",
"karma-chai-sinon": "^0.1.5",
"karma-coverage": "^0.5.0",
"karma-mocha": "^0.2.0",
"karma-phantomjs-launcher": "^0.2.1",
"karma-sourcemap-loader": "^0.3.7",
"karma-spec-reporter": "0.0.23",
"karma-webpack": "^1.7.0",
"mocha": "^2.2.5",
"node-sass": "^3.3.3",
"nodemon": "^1.8.1",
"phantomjs-prebuilt": "^2.1.3",
"phantomjs-polyfill": "0.0.1",
"postcss-loader": "^0.8.0",
"react-addons-test-utils": "^0.14.0",
"react-shallow-testutils": "^0.7.1",
"redux-devtools": "^3.0.0",
"redux-devtools-dock-monitor": "^1.0.1",
"redux-devtools-log-monitor": "^1.0.1",
"redux-mock-store": "0.0.6",
"sass-loader": "^3.0.0",
"sinon": "^1.17.2",
"sinon-chai": "^2.8.0",
"style-loader": "^0.13.0",
"url-loader": "^0.5.6",
"webpack": "1.12.9",
"webpack-dev-middleware": "^1.4.0",
"webpack-hot-middleware": "^2.6.0"
}
}
Любые идеи, что может привести к это?
Не могли бы вы опубликовать горячий код Root.js, который вы пытаетесь выполнить горячую перезагрузку +, как вы настраиваете Webpack с горячей перезагрузкой (параметры командной строки?)? Можете ли вы также рассказать нам о версиях React, Redux и Webpack, которые вы используете? Без этой информации сообщество с трудом помогает вам. – valscion
Спасибо, добавлен код. Как видно из версии Package.json версии React - 0.14, Redux 3, Webpack 1.12.9. – matejs
Трудно помочь без проекта, воспроизводящего проблему. –