Demo App Fails Webpack Build about kepler.gl HOT 13 CLOSED

Hello, @roqueleal! I quickly checked your repo and found at least one problem: there is no .babelrc file with list of presets to compile source core based on React correctly. Also, bundle.js.map is a file you need only for debugging compiled script and it'll be generated automatically by webpack if you add devtool:'source-map' to the webpack.config (see the original example). But this file does not affect tthe application running or not.
Maybe there are some other issues, but I can't figure out and can only suggest to try start from the begging, because I can assure you that the official example works fine (I've just test it).

from kepler.gl.

I should also add that I installed kepler.gl via npm install --save kepler.gl. When I clone the git repository itself and then run npm install and npm start, it runs fine. Is it possible the npm package is behind?

from kepler.gl.

Seeing You may need an appropriate loader to handle this file type., I believe this is a webpack configuration issue. If you're starting out, I would suggest heading over to http://vis.academy/#/kepler.gl/setup to try out the setup and following the configuration there.

from kepler.gl.

Thanks Chris, it does seem like a webpack configuration issue. I am able to get the demo app up and running through a git clone of this repository, but not if I install kepler.gl using npm. When I installed it using npm, I navigated into the /examples/demo-app folder and then tried to run npm install and npm start, thinking that would run the project, but that's when I encountered the error.

It seems like that is not the preferred way to run the example project, so to anyone else who encounters this issue, I would recommend using the git clone method described in the setup link that Chris shared.

Though it's probably worth leaving this issue open until you can run the example after an npm install?

from kepler.gl.

I see the issue now.

When I installed it using npm, I navigated into the /examples/demo-app folder and then tried to run npm install and npm start, thinking that would run the project, but that's when I encountered the error.

This is generally not supported. In fact, the npm package should not include the /examples folder. Typically, the workflow is inverted: people npm install the project, then use the package in their project, and should not attempt to run examples within the installed package.

I believe the bug here is that the package actually includes /examples folder. We should consider excluding it, which would mean smaller npm package download, and less confusion for users. The npm package should only include files that users would depend on while they include this package. Examples and documentation typically aren't part of the package.

We can do this by adding an .npmignore file: https://docs.npmjs.com/misc/developers

Agreed to leave this open until it's addressed.

from kepler.gl.

Makes sense, thanks for your help!

from kepler.gl.

@MattSkewbie, the demo-app is not supposed to be run inside node_modules/kepler.gl you should try build the demo-app by git clone [email protected]:uber/kepler.gl.git first then npm install && npm start.
The examples are included explicitly in the npm package by specified in files property in package.json.

from kepler.gl.

@heshan0131, thanks! I understand the paradigm now, my mistake.

from kepler.gl.

@heshan0131 @MattSkewbie @chrisirhc @maryzam Hello, like the previous comments I tried to build the application by changing the files package.json & webpack of the example "custom-reducer", although I get to create the build file, it does not seem to call the respective file.

I think the bundle.js.map file is also missing, I do not know how to create https://github.com/roqueleal/roqueleal.github.io/tree/master/chile

https://github.com/roqueleal/roqueleal.github.io/tree/master/chile

Thanks for your comments

from kepler.gl.

It looks like the official example works fine. I am gonna close this one.

from kepler.gl.

Hi, I am running into a webpack issue trying to run the demo-app on RHEL with node v8.9.4:
npm install followed by npm start from within examples/demo-app/ of a fresh git clone of the master branch produces the following output:

module.js:540
    throw err;
    ^

Error: Cannot find module 'webpack'
    at Function.Module._resolveFilename (module.js:538:15)
    at Function.Module._load (module.js:468:25)
    at Module.require (module.js:587:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (/kepler.gl/examples/webpack.config.local.js:30:17)
    at Module._compile (module.js:643:30)
    at Object.Module._extensions..js (module.js:654:10)
    at Module.load (module.js:556:32)
    at tryModuleLoad (module.js:499:12)
    at Function.Module._load (module.js:491:3)

it seems that webpack.config.local.js from the parent dir is required from webpack.config.js in the demo-app dir, is that the expected behaviour?

Thanks for any hints!

from kepler.gl.

@julianheinrich I'm running into the same issue. The webpack.config.local.js is like a decorator for webpack.config.js and it adds babel rules and hot reload settings.

The problem is that webpack.config.local.js requires webpack which is only installed inside demo-app. As a temporarily workaround, comment out const webpack = require('webpack'); and

      new webpack.EnvironmentPlugin([
        'MapboxAccessToken',
        'DropboxClientId',
        'MapboxExportToken'
      ])

in webpack.config.local.js will work. Another option is to use the webpack installed in demo-app like const webpack = require('./demo-app/node_modules/webpack');. Anyway, I'm also waiting for hints from others.

from kepler.gl.

Thanks for the hint. If someone finds this thread, the README in the examples is somewhat misleading. I was able to run it by issuing yarn install and yarn start from the root directory of the project. I guess I missed that in the main documentation and jumped right at the demo-app.

from kepler.gl.