search

esr360 / One-Nexus

ONE-NEXUS v4 IS IN ACTIVE DEVELOPMENT - USE WITH CAUTION UNTIL THEN - One-Nexus is a toolkit for architecting and constructing modular front-end user-interfaces
http://onenexus.io/
MIT License
102 stars 9 forks source link

Error on start #20

Open AnthonySGeorge opened 6 years ago

AnthonySGeorge commented 6 years ago

I've just downloaded from github after installing the npm modules I've ran 'npm start' but I'm getting errors ...

` @ ./src/app.js @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js

ERROR in ./src/ui/modules/elements/modal/modal.jsx Module not found: Error: Can't resolve '../../../../../../../Synergy/src/js/module.jsx' in '/One-Nexus/src/ui/modules/elements/modal' @ ./src/ui/modules/elements/modal/modal.jsx 1:0-57 @ ./src/app.js @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js

ERROR in ./src/ui/ui.js Module not found: Error: Can't resolve '../../../../Synergy/src/js/synergy' in '/One-Nexus/src/ui' @ ./src/ui/ui.js 69:15-60 @ ./src/app.js @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js

ERROR in ./src/app.js Module not found: Error: Can't resolve '../../../Kayzen-GS/src/js/index.js' in '/One-Nexus/src' @ ./src/app.js 184:13-58 @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js

ERROR in ./src/app.js Module not found: Error: Can't resolve '../../../Synergy/src/js/component.jsx' in '/One-Nexus/src' @ ./src/app.js 180:17-65 @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js

ERROR in ./src/app.js Module not found: Error: Can't resolve '../../../Synergy/src/js/module.jsx' in '/One-Nexus/src' @ ./src/app.js 176:14-59 @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js Child html-webpack-plugin for "index.html": Asset Size Chunks Chunk Names b84eb8b3f9453021b3be.hot-update.json 44 bytes [emitted]

ERROR in ./node_modules/css-loader!./node_modules/postcss-loader/lib??ref--1-2!./node_modules/sass-loader/lib/loader.js??ref--1-3!./src/app.scss Module build failed: @import '../../../Synergy/src/scss/synergy'; ^ File to import not found or unreadable: ../../../Synergy/src/scss/synergy. in One-Nexus/src/ui/ui.scss (line 18, column 1) @ ./src/app.scss 4:14-179 18:2-22:4 19:20-185 @ ./src/app.jsx @ ./src/app.js @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js

ERROR in ./src/ui/modules/elements/accordion/accordion.jsx Module not found: Error: Can't resolve '../../../../../../../Synergy/src/js/module.jsx' in '/One-Nexus/src/ui/modules/elements/accordion' @ ./src/ui/modules/elements/accordion/accordion.jsx 1:0-57 @ ./src/app.js @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js

ERROR in ./src/ui/modules/elements/alert/alert.jsx Module not found: Error: Can't resolve '../../../../../../../Synergy/src/js/module.jsx' in '/One-Nexus/src/ui/modules/elements/alert' @ ./src/ui/modules/elements/alert/alert.jsx 1:0-57 @ ./src/app.js @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js

ERROR in ./src/ui/modules/elements/blockquote/blockquote.jsx Module not found: Error: Can't resolve '../../../../../../../Synergy/src/js/module.jsx' in '/One-Nexus/src/ui/modules/elements/blockquote' @ ./src/ui/modules/elements/blockquote/blockquote.jsx 1:0-57 @ ./src/app.js @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js

ERROR in ./src/ui/modules/elements/button/button.jsx Module not found: Error: Can't resolve '../../../../../../../Synergy/src/js/module.jsx' in '/One-Nexus/src/ui/modules/elements/button' @ ./src/ui/modules/elements/button/button.jsx 1:0-57 @ ./src/app.js @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js

ERROR in ./src/ui/modules/elements/form/form.jsx Module not found: Error: Can't resolve '../../../../../../../Synergy/src/js/module.jsx' in '/One-Nexus/src/ui/modules/elements/form' @ ./src/ui/modules/elements/form/form.jsx 1:0-57 @ ./src/app.js @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js

ERROR in ./src/ui/modules/elements/modal/modal.jsx Module not found: Error: Can't resolve '../../../../../../../Synergy/src/js/module.jsx' in '/One-Nexus/src/ui/modules/elements/modal' @ ./src/ui/modules/elements/modal/modal.jsx 1:0-57 @ ./src/app.js @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js

ERROR in ./src/ui/ui.js Module not found: Error: Can't resolve '../../../../Synergy/src/js/synergy' in '/One-Nexus/src/ui' @ ./src/ui/ui.js 69:15-60 @ ./src/app.js @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js

ERROR in ./src/app.js Module not found: Error: Can't resolve '../../../Kayzen-GS/src/js/index.js' in '/One-Nexus/src' @ ./src/app.js 184:13-58 @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js

ERROR in ./src/app.js Module not found: Error: Can't resolve '../../../Synergy/src/js/component.jsx' in '/One-Nexus/src' @ ./src/app.js 180:17-65 @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js

ERROR in ./src/app.js Module not found: Error: Can't resolve '../../../Synergy/src/js/module.jsx' in '/One-Nexus/src' @ ./src/app.js 176:14-59 @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js Child html-webpack-plugin for "index.html":`

esr360 commented 6 years ago

Hi - thanks so much for reporting this error.

The master branch is currently unstable and in active development - (looks like the master branch is pointing to local copies of a dependency instead of looking inside the node_modules directory) does the same error occur when you download version 3 from the releases page? https://github.com/esr360/One-Nexus/releases

AnthonySGeorge commented 6 years ago

Version 3 - "npm ERR! missing script: start"

esr360 commented 6 years ago

I've now updated the master branch - please try again - though as mentioned this is still an unstable development project until the next release.

AnthonySGeorge commented 6 years ago

ERROR in ./src/app.js Module not found: Error: Can't resolve '../../../Kayzen-GS/src/js/index.js' in 'One-Nexus-master/src' @ ./src/app.js 172:13-58 @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js

esr360 commented 6 years ago

You can just locate the culpable ../../../Kayzen-GS/src/js/index.js and replace it with Kayzen-GS. You can see it's pointing to a relative path (which won't exist for you) instead of using node_modules, This code will be in the One-Nexus-master/src/app.js file.

So on line 43, change:

import { Row, Column } from '../../../Kayzen-GS/src/js/index.js';

To:

import { Row, Column } from 'Kayzen-GS';

Or you might need to lower-case it:

import { Row, Column } from 'kayzen-gs';

...now to see what the next error after this is 🙃

AnthonySGeorge commented 6 years ago

I appreciate your efforts to help me get this working. Latest error ;)

The Kayzen-GS module is in the node_modules directory.

ERROR in ./src/app.js
Module not found: Error: Can't resolve 'Kayzen-GS' in '/One-Nexus-master/src'
 @ ./src/app.js 172:16-36
 @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js

I've also tried installing 'kayzen-gs' which is version 2.5.0 and importing '../node_modules/kayzen-gs/src/js/index.js' but this gives me this error ...

ERROR in ./node_modules/kayzen-gs/src/js/column.jsx
Module parse failed: Unexpected token (52:12)
You may need an appropriate loader to handle this file type.
|     render() {
|         return (
|             <this.tag {...this.props} className={this.class}>
|                 { this.props.children }
|             </this.tag>
 @ ./node_modules/kayzen-gs/src/js/index.js 2:0-49
 @ ./src/app.js
 @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js

ERROR in ./node_modules/kayzen-gs/src/js/row.jsx
Module parse failed: Unexpected token (59:12)
You may need an appropriate loader to handle this file type.
|     render() {
|         return (
|             <this.tag className={this.class}>
|                 { this.props.children }
|             </this.tag>
 @ ./node_modules/kayzen-gs/src/js/index.js 1:0-43
 @ ./src/app.js
 @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js
esr360 commented 6 years ago

And I appreciate your efforts too, you're helping a bunch with bug fixes etc.

I've also tried installing 'kayzen-gs' which is version 2.5.0 and importing '../node_modules/kayzen-gs/src/js/index.js' but this gives me this error ...

This is the kayzen-gs version you want.

However, it looks like you are importing the src file, which is untranspiled, and since when we run Webpack, we exclude the node_modules directory, it means that anything we import from node_modules must be already transpiled.

So, you should in theory be able to fix your error by changing ../node_modules/kayzen-gs/src/js/index.js to ../node_modules/kayzen-gs/dist/kayzen-gs.js

And since the dist/kayzen-gs.js file is listed as the main file in package.json, you should actually just be able to do:

import { Row, Column } from 'kayzen-gs';

instead of:

import { Row, Column } from '../node_modules/kayzen-gs/dist/kayzen-gs.js';

Assuming you have installed the latest 2.5 version using the lowercase characters.

FYI, Kayzen-GS is the custom grid system built for One-Nexus and has only recently been updated to include React components.

AnthonySGeorge commented 6 years ago

okay I think we're moving forward ...

WARNING in ./node_modules/React/cjs/react.development.js
There are multiple modules with names that only differ in casing.
This can lead to unexpected behavior when compiling on a filesystem with other case-semantic.
Use equal casing. Compare these module identifiers:
*/One-Nexus-master/node_modules/React/cjs/react.development.js
    Used by 1 module(s), i. e.
    /One-Nexus-master/node_modules/React/index.js
* /One-Nexus-master/node_modules/react/cjs/react.development.js
    Used by 1 module(s), i. e.
    /One-Nexus-master/node_modules/react/index.js
 @ ./node_modules/React/cjs/react.development.js
 @ ./node_modules/React/index.js
 @ ./node_modules/kayzen-gs/dist/kayzen-gs.js
 @ ./src/app.js
 @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js

WARNING in ./node_modules/React/index.js
There are multiple modules with names that only differ in casing.
This can lead to unexpected behavior when compiling on a filesystem with other case-semantic.
Use equal casing. Compare these module identifiers:
* /One-Nexus-master/node_modules/React/index.js
    Used by 1 module(s), i. e.
    /One-Nexus-master/node_modules/kayzen-gs/dist/kayzen-gs.js
* /One-Nexus-master/node_modules/react/index.js
    Used by 51 module(s), i. e.
    /One-Nexus-master/src/app.js
 @ ./node_modules/React/index.js
 @ ./node_modules/kayzen-gs/dist/kayzen-gs.js
 @ ./src/app.js
 @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js

ERROR in ./node_modules/kayzen-gs/dist/kayzen-gs.js
Module not found: Error: Can't resolve 'ReactDOM' in '/One-Nexus-master/node_modules/kayzen-gs/dist'
 @ ./node_modules/kayzen-gs/dist/kayzen-gs.js 415:17-36
 @ ./src/app.js
 @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/app.js
esr360 commented 6 years ago

Ok, I think I've figured this one out. It's a bit annoying - I have uncommitted (and hence unreleased) changes (fixes) to Kayzen-GS, so I will have to publish a new release (2.5.1) and get you to install that.

(I need to re-generate the Kayzen-GS bundle with this fix https://github.com/esr360/Kayzen-GS/commit/8fb3b94bb95970cac575fda6eed0499b597ce3d1)

Should be able to do this within the next couple of hours.

Thanks again for your help and your patience.

esr360 commented 6 years ago

@AnthonySGeorge Ok I've released version 2.5.1 of kayzen-gs - I was able to re-create your setup and issues, and with this fix it now seems to be compiling. Let me know how you get on!

AnthonySGeorge commented 6 years ago

Success (sort of) ... It's now compiling (yipeee !) however, nothing is loading in the browser. Console errors:

browser.js

Uncaught Error: A <Router> may have only one child element
    at invariant (browser.js:38)
    at Router.componentWillMount (Router.js:64)
    at callComponentWillMount (react-dom.development.js:11507)
    at mountClassInstance (react-dom.development.js:11590)
    at updateClassComponent (react-dom.development.js:13145)
    at beginWork (react-dom.development.js:13824)
    at performUnitOfWork (react-dom.development.js:15863)
    at workLoop (react-dom.development.js:15902)
    at HTMLUnknownElement.callCallback (react-dom.development.js:100)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:138)

react-dom.development.js

react-dom.development.js:14226 The above error occurred in the <Router> component:
    in Router (created by HashRouter)
    in HashRouter

Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://fb.me/react-error-boundaries to learn more about error boundaries.

react-dom.development.js

Uncaught Error: A <Router> may have only one child element
    at invariant (browser.js:38)
    at Router.componentWillMount (Router.js:64)
    at callComponentWillMount (react-dom.development.js:11507)
    at mountClassInstance (react-dom.development.js:11590)
    at updateClassComponent (react-dom.development.js:13145)
    at beginWork (react-dom.development.js:13824)
    at performUnitOfWork (react-dom.development.js:15863)
    at workLoop (react-dom.development.js:15902)
    at renderRoot (react-dom.development.js:15942)
    at performWorkOnRoot (react-dom.development.js:16560)
esr360 commented 6 years ago

Dang, well at least it's compiling now! On first glance these errors don't look at all familiar (unlike the others), please give me some time to investigate :)