Color Picker tutorial

[shepelevstas]

Marko Version: 4.2.4

In short

Some error in the marko-starter-demo

Details

Following the instructions in Color Picker tutorial article, after npm start and navigating to localhost:8080, I get an error in the terminal:

[marko-starter marko-starter-demo http-server request] GET /
[marko-starter marko-starter-demo] Building page /...
[marko-starter marko-starter-demo] Error building page /. Error: Error: Render async fragment error (lasso-slot:head). Exception: Error: Failed to walk dependency [require: C:\Users\stas\Projects\helloMarko\src\index.marko.js.init.js]. Dependency chain: [require: C:\Users\stas\Projects\helloMarko\src\index.marko.js.init.js]. Cause: Error: Module not found: C:UsersstasProjectshelloMarkosrccomponentsclick-countindex.marko (from "src" and referenced in "src\index.marko.js.init.js")
    at module.exports (C:\Users\stas\Projects\helloMarko\node_modules\raptor-util\createError.js:7:50)
    at AsyncValue.<anonymous> (C:\Users\stas\Projects\helloMarko\node_modules\lasso\lib\dependency-walker.js:141:48)
    at notifyCallbacks (C:\Users\stas\Projects\helloMarko\node_modules\raptor-async\AsyncValue.js:76:35)
    at AsyncValue.reject (C:\Users\stas\Projects\helloMarko\node_modules\raptor-async\AsyncValue.js:240:9)
    at getDependenciesCallback (C:\Users\stas\Projects\helloMarko\node_modules\lasso\lib\dependencies\Dependency.js:373:47)
Caused by: Error: Module not found: C:UsersstasProjectshelloMarkosrccomponentsclick-countindex.marko (from "src" and referenced
in "src\index.marko.js.init.js")
    at handleRequire (C:\Users\stas\Projects\helloMarko\node_modules\lasso-require\src\inspect-cache.js:35:23)
    at Array.map (<anonymous>)
    at resolveInspectedRequires (C:\Users\stas\Projects\helloMarko\node_modules\lasso-require\src\inspect-cache.js:46:61)
    at afterInspect (C:\Users\stas\Projects\helloMarko\node_modules\lasso-require\src\inspect-cache.js:109:9)
Creation stack trace: Error
    at AsyncStream.beginAsync (C:\Users\stas\Projects\helloMarko\node_modules\marko\src\runtime\html\AsyncStream.js:188:56)
    at render (C:\Users\stas\Projects\helloMarko\node_modules\lasso\taglib\slot-tag.js:95:28)
    at render (C:\Users\stas\Projects\helloMarko\node_modules\lasso\taglib\head-tag.js:10:5)
    at wrappedRenderer (C:\Users\stas\Projects\helloMarko\node_modules\marko\src\runtime\helpers.js:198:13)
    at render (C:\Users\stas\Projects\helloMarko\src\components\site-layout\index.marko.js:32:3)
    at Template.renderer (C:\Users\stas\Projects\helloMarko\node_modules\marko\src\components\renderer.js:217:9)
enderer.js:217                                                                                 7:31)
    at hotReloadProxy (C:\Users\stas\Projects\helloMarko\node_modules\marko\src\hot-reload.js:9s.js:198:13)
7:31)
    at wrappedRenderer (C:\Users\stas\Projects\helloMarko\node_modules\marko\src\runtime\helperenderer.js:217:9)
ime\helper                                                                                     \AsyncStream.js:437:13)
    at render (C:\Users\stas\Projects\helloMarko\src\components\site-layout\index.mar          s:106:30)
ko.js:32:3                                                                           mponents\r
    at Template.renderer (C:\Users\stas\Projects\helloMarko\node_modules\marko\src\co
mponents\r                                                                           ntime\html    at render (C:\Users\stas\Projects\helloMarko\node_modules\lasso\taglib\slot-tag.j    at render (C:\Users\stas\Projects\helloMarko\node_modules\lasso\taglib\head-tag.jslot-tag.j    at wrappedRenderer (C:\Users\stas\Projects\helloMarko\node_modules\marko\src\runt    at render (C:\Users\stas\Projects\helloMarko\src\components\site-layout\index.mar    at Template.renderer (C:\Users\stas\Projects\helloMarko\node_modules\marko\src\co    at hotReloadProxy (C:\Users\stas\Projects\helloMarko\node_modules\marko\src\hot-r    at wrappedRenderer (C:\Users\stas\Projects\helloMarko\node_modules\marko\src\runt    at render (C:\Users\stas\Projects\helloMarko\src\index.marko.js:21:3)    at Template.renderer (C:\Users\stas\Projects\helloMarko\node_modules\marko    at AsyncStream.error (C:\Users\stas\Projects\helloMarko\node_modules\marko    at process.nextTick (C:\Users\stas\Projects\helloMarko\node_modules\lasso\    at process._tickCallback (internal/process/next_tick.js:61:11)

and the app is not working properly. I believe the problem is Module not found: C:UsersstasProjectshelloMarkosrccomponentsclick-countindex.marko (from "src" and referenced in "src\index.marko.js.init.js")

Additional Info

### Your Environment node 10.6.0 Windows7 64bit Firefox 61.0 Chrome 67 ### Steps to Reproduce following `https://markojs.com/docs/color-picker/#getting-started` then navigate to `localhost:8080`

[smael123]

In index.marko under the color-picker-tutorial/src path, comment out the code that renders the click-count component. Comment out the stop watch one as well under routes.

[smael123]

I ran into another issue as I continued. Basically the packages are out of date according to this: https://medium.com/biji-inovasi/marko-js-error-module-not-found-40ffe5e10491

(translate from Indonesian to whatever language you can read).

I updated them and it worked (or is working so far).

[DylanPiercey]

The examples should now be updated in http://github.com/marko-js/examples