Beginner question.

[alexchern]

Hi there,

Followed the instructions, but this is what I got at the end:

C:\WorkTmp\react-redux-cesium-testing-demo>npm run dev

[email protected] dev C:\WorkTmp\react-redux-cesium-testing-demo
cross-env NODE_ENV=development node devServer.js

Listening at http://localhost:3000
webpack built 46de09b66803c0958f28 in 920ms
Hash: 46de09b66803c0958f28
Time: 920ms
chunk {0} app.js (app) 8.13 kB [rendered]

ERROR in ./src/index.js
Module build failed: TypeError: Path must be a string. Received undefined
at assertPath (path.js:7:11)
at Object.dirname (path.js:695:5)
at C:\WorkTmp\react-redux-cesium-testing-demo\node_modules\babel-core\lib\transformation\file\options\option-manager.js:374:36
at C:\WorkTmp\react-redux-cesium-testing-demo\node_modules\babel-core\lib\transformation\file\options\option-manager.js:396:22
at Array.map (native)
at OptionManager.resolvePresets (C:\WorkTmp\react-redux-cesium-testing-demo\node_modules\babel-core\lib\transformation\file\options\option-manager.js:385:20)
at OptionManager.mergePresets (C:\WorkTmp\react-redux-cesium-testing-demo\node_modules\babel-core\lib\transformation\file\options\option-manager.js:369:10)
at OptionManager.mergeOptions (C:\WorkTmp\react-redux-cesium-testing-demo\node_modules\babel-core\lib\transformation\file\options\option-manager.js:328:14)
at C:\WorkTmp\react-redux-cesium-testing-demo\node_modules\babel-core\lib\transformation\file\options\option-manager.js:370:14
at C:\WorkTmp\react-redux-cesium-testing-demo\node_modules\babel-core\lib\transformation\file\options\option-manager.js:390:24
at Array.map (native)
at OptionManager.resolvePresets (C:\WorkTmp\react-redux-cesium-testing-demo\node_modules\babel-core\lib\transformation\file\options\option-manager.js:385:20)
at OptionManager.mergePresets (C:\WorkTmp\react-redux-cesium-testing-demo\node_modules\babel-core\lib\transformation\file\options\option-manager.js:369:10)
at OptionManager.mergeOptions (C:\WorkTmp\react-redux-cesium-testing-demo\node_modules\babel-core\lib\transformation\file\options\option-manager.js:328:14)
at OptionManager.addConfig (C:\WorkTmp\react-redux-cesium-testing-demo\node_modules\babel-core\lib\transformation\file\options\option-manager.js:234:10)
at OptionManager.findConfigs (C:\WorkTmp\react-redux-cesium-testing-demo\node_modules\babel-core\lib\transformation\file\options\option-manager.js:434:16)
@ multi app
Child html-webpack-plugin for "index.html":
chunk {0} index.html 412 kB [rendered]
webpack: bundle is now VALID.

What's wrong?

Thanks a lot,

Alex

[markerikson]

Appears to be webpack/webpack#2463 . Basically, something about babel-core does not work under Node 6+, but only under Node 5. Upgrading babel-core to 6.10.4+ is supposed to fix the issue.

FYI, I'm currently working on a blog post that will show how to use Cesium in a Webpack-based application, with a newer sample project as an example. Keep an eye on http://blog.isquaredsoftware.com/ - I hope to publish the post by next week.

Also, out of curiosity: how did you find this repo?

[alexchern]

Hi Mark, Thanks for the prompt response. Actually, I was looking for some guidance on how to put cesiumjs and a react on one page (+ using redux, to make it right). I'm a novice to all this stuff and your blog kinda has it all... I'd like to use a cesiumjs instead of deprecated GE plugin (in some of our applications) and in the web based solution ( http://vod-aws.impleotv.com/ ) instead of leaflet. So, from what I understand (and I don't understand much :-) it is better just to split a page and keep cesium in a DOM while all the rest to implement using react.. Thanks, Alex

…

On Thu, Mar 2, 2017 at 6:38 PM, Mark Erikson ***@***.***> wrote: Appears to be webpack/webpack#2463 <webpack/webpack#2463> . Basically, something about babel-core does not work under Node 6+, but only under Node 5. Upgrading babel-core to 6.10.4+ is supposed to fix the issue. FYI, I'm currently working on a blog post that will show how to use Cesium in a Webpack-based application, with a newer sample project as an example. Keep an eye on http://blog.isquaredsoftware.com/ - I hope to publish the post by next week. Also, out of curiosity: how did you find this repo? — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#5 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AJHeYVegMeC9nMcQ9-m5sYTobFNTtUudks5rhvCZgaJpZM4MQn7h> .

[markerikson]

Gotcha. Well, if you gimme just a few more days, you'll have a lot more information on the topic available :)

And yeah, what I'm going to demonstrate in more depth is how to:

• Initialize and show Cesium at a basic level in a Webpack-based app
• Control Cesium's behavior using React components (rendering billboards+labels+polylines, mouse interaction, camera control)
• Advanced Webpack configuration to enable code splitting and delay-loading Cesium

[markerikson]

And as promised, I just published a 2-part post on "Declaratively Rendering Earth in 3D: Using Cesium with React and Webpack". Part 1 covers basic Cesium+Webpack setup and build optimization with DllPlugin. Part 2 shows declarative React components that wrap imperative APIs:

http://blog.isquaredsoftware.com/2017/03/declarative-earth-part-1-cesium-webpack/
http://blog.isquaredsoftware.com/2017/03/declarative-earth-part-2-cesium-react/