Kitware / paraviewweb

Web framework for building interactive visualization relying on VTK or ParaView to produce visualization data
http://kitware.github.io/paraviewweb/
BSD 3-Clause "New" or "Revised" License
160 stars 50 forks source link

Babel version #495

Open taus opened 5 years ago

taus commented 5 years ago

i followed the guide here: https://kitware.github.io/paraviewweb/docs/setup.html and have run to an issue with babel. When i try to run the build command i get this:

C:\Users\Taus\development\misc\webview-test>npm run build

webview-test@1.0.0 build C:\Users\Taus\development\misc\webview-test webpack --mode development

Hash: 8b779b74357295c9791c Version: webpack 4.23.1 Time: 809ms Built at: 2019-04-17 11:11:12 Asset Size Chunks Chunk Names MyWebApp.js 10 KiB main [emitted] main index.html 184 bytes [emitted] Entrypoint main = MyWebApp.js [./node_modules/babel-loader/lib/index.js?presets[]=env,presets[]=react!./src/index.js] ./node_modules/babel-loader/lib?presets[]=env,presets[]=react!./src/index.js 3.47 KiB {main} [built] [failed] [1 error] [./node_modules/webpack/buildin/global.js] (webpack)/buildin/global.js 489 bytes {main} [built] [./src/index.js-exposed] 185 bytes {main} [built]

ERROR in ./src/index.js (./node_modules/babel-loader/lib?presets[]=env,presets[]=react!./src/index.js) Module build failed (from ./node_modules/babel-loader/lib/index.js): Error: Cannot find module 'babel-preset-env' from 'C:\Users\Taus\development\misc\webview-test'

  • Did you mean "@babel/env"? at Function.module.exports [as sync] (C:\Users\Taus\development\misc\webview-test\node_modules\resolve\lib\sync.js:58:15) at resolveStandardizedName (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\files\plugins.js:101:31) at resolvePreset (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\files\plugins.js:58:10) at loadPreset (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\files\plugins.js:77:20) at createDescriptor (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\config-descriptors.js:154:9) at items.map (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\config-descriptors.js:109:50) at Array.map () at createDescriptors (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\config-descriptors.js:109:29) at createPresetDescriptors (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\config-descriptors.js:101:10) at passPerPreset (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\config-descriptors.js:58:96) at cachedFunction (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\caching.js:33:19) at presets.presets (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\config-descriptors.js:29:84) at mergeChainOpts (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\config-chain.js:315:26) at C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\config-chain.js:278:7 at buildRootChain (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\config-chain.js:68:29) at loadPrivatePartialConfig (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\partial.js:85:55) at Object.loadPartialConfig (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\partial.js:110:18) at Object. (C:\Users\Taus\development\misc\webview-test\node_modules\babel-loader\lib\index.js:140:26) at Generator.next () at asyncGeneratorStep (C:\Users\Taus\development\misc\webview-test\node_modules\babel-loader\lib\index.js:3:103) at _next (C:\Users\Taus\development\misc\webview-test\node_modules\babel-loader\lib\index.js:5:194) at C:\Users\Taus\development\misc\webview-test\node_modules\babel-loader\lib\index.js:5:364 at new Promise () at Object. (C:\Users\Taus\development\misc\webview-test\node_modules\babel-loader\lib\index.js:5:97) at Object._loader (C:\Users\Taus\development\misc\webview-test\node_modules\babel-loader\lib\index.js:220:18) at Object.loader (C:\Users\Taus\development\misc\webview-test\node_modules\babel-loader\lib\index.js:56:18) at Object. (C:\Users\Taus\development\misc\webview-test\node_modules\babel-loader\lib\index.js:51:12) @ ./src/index.js-exposed 1:38-184 Child html-webpack-plugin for "index.html": 1 asset Entrypoint undefined = index.html [./node_modules/webpack/buildin/global.js] (webpack)/buildin/global.js 489 bytes {0} [built] [./node_modules/webpack/buildin/module.js] (webpack)/buildin/module.js 497 bytes {0} [built]
    • 2 hidden modules npm ERR! code ELIFECYCLE npm ERR! errno 2 npm ERR! webview-test@1.0.0 build: webpack --mode development npm ERR! Exit status 2 npm ERR! npm ERR! Failed at the webview-test@1.0.0 build script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\Taus\AppData\Roaming\npm-cache_logs\2019-04-17T09_11_12_153Z-debug.log

I tried installing the "missing module" babel-preset-env and babel-preset-react which it would then complain about. However this just spawns a new error:

webview-test@1.0.0 build C:\Users\Taus\development\misc\webview-test webpack --mode development

Hash: c629ebcb1ae9054b2e9e Version: webpack 4.23.1 Time: 1812ms Built at: 2019-04-17 11:16:12 Asset Size Chunks Chunk Names MyWebApp.js 9.41 KiB main [emitted] main index.html 184 bytes [emitted] Entrypoint main = MyWebApp.js [./node_modules/babel-loader/lib/index.js?presets[]=env,presets[]=react!./src/index.js] ./node_modules/babel-loader/lib?presets[]=env,presets[]=react!./src/index.js 2.97 KiB {main} [built] [failed] [1 error] [./node_modules/webpack/buildin/global.js] (webpack)/buildin/global.js 489 bytes {main} [built] [./src/index.js-exposed] 185 bytes {main} [built]

ERROR in ./src/index.js (./node_modules/babel-loader/lib?presets[]=env,presets[]=react!./src/index.js) Module build failed (from ./node_modules/babel-loader/lib/index.js): Error: Plugin/Preset files are not allowed to export objects, only functions. In C:\Users\Taus\development\misc\webview-test\node_modules\babel-preset-react\lib\index.js at createDescriptor (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\config-descriptors.js:178:11) at items.map (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\config-descriptors.js:109:50) at Array.map () at createDescriptors (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\config-descriptors.js:109:29) at createPresetDescriptors (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\config-descriptors.js:101:10) at passPerPreset (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\config-descriptors.js:58:96) at cachedFunction (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\caching.js:33:19) at presets.presets (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\config-descriptors.js:29:84) at mergeChainOpts (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\config-chain.js:315:26) at C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\config-chain.js:278:7 at buildRootChain (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\config-chain.js:68:29) at loadPrivatePartialConfig (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\partial.js:85:55) at Object.loadPartialConfig (C:\Users\Taus\development\misc\webview-test\node_modules\@babel\core\lib\config\partial.js:110:18) at Object. (C:\Users\Taus\development\misc\webview-test\node_modules\babel-loader\lib\index.js:140:26) at Generator.next () at asyncGeneratorStep (C:\Users\Taus\development\misc\webview-test\node_modules\babel-loader\lib\index.js:3:103) at _next (C:\Users\Taus\development\misc\webview-test\node_modules\babel-loader\lib\index.js:5:194) at C:\Users\Taus\development\misc\webview-test\node_modules\babel-loader\lib\index.js:5:364 at new Promise () at Object. (C:\Users\Taus\development\misc\webview-test\node_modules\babel-loader\lib\index.js:5:97) at Object._loader (C:\Users\Taus\development\misc\webview-test\node_modules\babel-loader\lib\index.js:220:18) at Object.loader (C:\Users\Taus\development\misc\webview-test\node_modules\babel-loader\lib\index.js:56:18) at Object. (C:\Users\Taus\development\misc\webview-test\node_modules\babel-loader\lib\index.js:51:12) @ ./src/index.js-exposed 1:38-184

someone here https://github.com/babel/babel/issues/7903 reported the exact same behavior. It seems they solved it by removing references to old babel versions in a .babelrc or package.json file. Unfortunately i cannot find any reference to it in my package.json and have no .babelrc

any hints on how to progress would be greatly appreciated

jourdain commented 5 years ago

Before going into details, I just want to make sure we are tackling the actual issue you are trying to solve.

  1. Are you trying to build a Web application and use some components that belong to ParaViewWeb?
  2. Or are you trying to deploy some ParaViewWeb application to enable 3D visualization inside a browser?
taus commented 5 years ago

I don't really know how to answer that. For now, i am mostly trying to figure out what can be done with paraviewweb. In the end i am aiming to do some data visualization including 3d visualization. For now though i am just trying to figure out what tools are available

To that end i ran through https://kitware.github.io/paraviewweb/docs/setup.html and after a few hiccups i ended up at this error.

The documentation suggests that all you need is git and node. However that doesn't seem to be the case. I, at least, needed visual studio build tool and GTK2 as well

here is the steps i took to get it running in a powershell with admin priviliges: $ npm install --global --production windows-build-tools --vs2015 $ npm config set msvs_version 2015 –global

download and unzip GTK to c:/GTK

For some reason probably to do with environment variable the next part only worked in visual studio developer console $ mkdir MyWebProject $ cd MyWebProject $ npm init $ npm install paraviewweb --save

At this point i i followed the steps in "Creating your own Project" and tried the npm run build and npm start commands and it told me i was missing webpack.

So i ran the 3 commands listed and got the babel error:

$ npm install kw-web-suite --save-dev $ npm install normalize.css --save-dev $ npm install monologue.js --save-dev

jourdain commented 5 years ago

Ok I see, the issue is related to the fact that the latest kw-web-suite is not compatible with paraviewweb. You may have to do npm install kw-web-suite@6.2.0 --save-dev instead.

But since you are just looking around, you should start by trying ParaView Visualizer, ParaView Lite and ParaView Divvy that are all bundled inside ParaView binaries that can be downloaded here. To start those application you will have to run the command line described here.

Then you can see the various widgets that are part of the ParaViewWeb library here.

taus commented 5 years ago

Thanks. That did it. I will also take a look your other suggestions.