ERROR in ./node_modules/vtk.js/Sources/Rendering/OpenGL/glsl/vtkVolumeVS.glsl 18:10

Hi,

I was trying to follow the example on https://kitware.github.io/vtk-js/docs/intro_vtk_as_es6_dependency.html and am reaching an error (at the bottom of the message).

I have gone through the example a few times on separate computers and hit the wall at the same point. Its possible I am missing something, but i am sure I have followed the example properly, but I am not very experienced with JS, so maybe i am missing something.

Thanks

ERROR in ./node_modules/vtk.js/Sources/Rendering/OpenGL/glsl/vtkVolumeVS.glsl 18:10
Module parse failed: Unexpected token (18:10)
You may need an appropriate loader to handle this file type.
| =========================================================================*/
|
> attribute vec4 vertexDC;
|
| varying vec3 vertexVCVSOutput;
 @ ./node_modules/vtk.js/Sources/Rendering/OpenGL/VolumeMapper/index.js 20:0-80 83:21-32
 @ ./node_modules/vtk.js/Sources/Rendering/OpenGL/ViewNodeFactory/index.js
 @ ./node_modules/vtk.js/Sources/Rendering/OpenGL/RenderWindow/index.js
 @ ./node_modules/vtk.js/Sources/Rendering/Misc/FullScreenRenderWindow/index.js
 @ ./src/index.js
 @ ./src/index.js-exposed

ERROR in ./node_modules/vtk.js/Sources/Rendering/OpenGL/glsl/vtkPolyDataVS.glsl 18:10
Module parse failed: Unexpected token (18:10)
You may need an appropriate loader to handle this file type.
| =========================================================================*/
|
> attribute vec4 vertexMC;
|
| // frag position in VC
 @ ./node_modules/vtk.js/Sources/Rendering/OpenGL/ImageMapper/index.js 18:0-84 92:21-34
 @ ./node_modules/vtk.js/Sources/Rendering/OpenGL/ViewNodeFactory/index.js
 @ ./node_modules/vtk.js/Sources/Rendering/OpenGL/RenderWindow/index.js
 @ ./node_modules/vtk.js/Sources/Rendering/Misc/FullScreenRenderWindow/index.js
 @ ./src/index.js
 @ ./src/index.js-exposed

ERROR in ./node_modules/vtk.js/Sources/Rendering/OpenGL/glsl/vtkSphereMapperVS.glsl 19:10
Module parse failed: Unexpected token (19:10)
You may need an appropriate loader to handle this file type.
| // this shader implements imposters in OpenGL for Spheres
|
> attribute vec4 vertexMC;
| attribute vec2 offsetMC;
|
 @ ./node_modules/vtk.js/Sources/Rendering/OpenGL/SphereMapper/index.js 12:0-92 29:21-38
 @ ./node_modules/vtk.js/Sources/Rendering/OpenGL/ViewNodeFactory/index.js
 @ ./node_modules/vtk.js/Sources/Rendering/OpenGL/RenderWindow/index.js
 @ ./node_modules/vtk.js/Sources/Rendering/Misc/FullScreenRenderWindow/index.js
 @ ./src/index.js
 @ ./src/index.js-exposed

ERROR in ./node_modules/vtk.js/Sources/Rendering/OpenGL/glsl/vtkStickMapperVS.glsl 19:10
Module parse failed: Unexpected token (19:10)
You may need an appropriate loader to handle this file type.
| // this shader implements imposters in OpenGL for Sticks
|
> attribute vec4 vertexMC;
| attribute vec3 orientMC;
| attribute vec4 offsetMC;
 @ ./node_modules/vtk.js/Sources/Rendering/OpenGL/StickMapper/index.js 7:0-90 27:21-37
 @ ./node_modules/vtk.js/Sources/Rendering/OpenGL/ViewNodeFactory/index.js
 @ ./node_modules/vtk.js/Sources/Rendering/OpenGL/RenderWindow/index.js
 @ ./node_modules/vtk.js/Sources/Rendering/Misc/FullScreenRenderWindow/index.js
 @ ./src/index.js
 @ ./src/index.js-exposed

ERROR in ./node_modules/vtk.js/Sources/Rendering/OpenGL/glsl/vtkPolyDataFS.glsl 19:8
Module parse failed: Unexpected token (19:8)
You may need an appropriate loader to handle this file type.
| // Template for the polydata mappers fragment shader
|
> uniform int PrimitiveIDOffset;
|
| // VC position of this fragment
 @ ./node_modules/vtk.js/Sources/Rendering/OpenGL/SphereMapper/index.js 13:0-84 30:23-36
 @ ./node_modules/vtk.js/Sources/Rendering/OpenGL/ViewNodeFactory/index.js
 @ ./node_modules/vtk.js/Sources/Rendering/OpenGL/RenderWindow/index.js
 @ ./node_modules/vtk.js/Sources/Rendering/Misc/FullScreenRenderWindow/index.js
 @ ./src/index.js
 @ ./src/index.js-exposed

ERROR in ./node_modules/vtk.js/Sources/Rendering/OpenGL/glsl/vtkVolumeFS.glsl 22:8
Module parse failed: Unexpected token (22:8)
You may need an appropriate loader to handle this file type.
| //VTK::Output::Dec
|
> varying vec3 vertexVCVSOutput;
|
| // camera values
 @ ./node_modules/vtk.js/Sources/Rendering/OpenGL/VolumeMapper/index.js 21:0-80 87:25-36
 @ ./node_modules/vtk.js/Sources/Rendering/OpenGL/ViewNodeFactory/index.js
 @ ./node_modules/vtk.js/Sources/Rendering/OpenGL/RenderWindow/index.js
 @ ./node_modules/vtk.js/Sources/Rendering/Misc/FullScreenRenderWindow/index.js
 @ ./src/index.js
 @ ./src/index.js-exposed

ERROR in ./node_modules/vtk.js/Sources/Rendering/OpenGL/glsl/vtkVolumeFS2.glsl 22:8
Module parse failed: Unexpected token (22:8)
You may need an appropriate loader to handle this file type.
| //VTK::Output::Dec
|
> varying vec3 vertexVCVSOutput;
|
| // camera values
 @ ./node_modules/vtk.js/Sources/Rendering/OpenGL/VolumeMapper/index.js 22:0-82 85:25-37
 @ ./node_modules/vtk.js/Sources/Rendering/OpenGL/ViewNodeFactory/index.js
 @ ./node_modules/vtk.js/Sources/Rendering/OpenGL/RenderWindow/index.js
 @ ./node_modules/vtk.js/Sources/Rendering/Misc/FullScreenRenderWindow/index.js
 @ ./src/index.js
 @ ./src/index.js-exposed

[floryst]

I made a quick & minimal working example of vtk.js in Angular 10 default template: https://github.com/floryst/vtk-js-angular-10

You can read the README.md for a general overview, and the second commit in the repo is the changeset from the default angular 10 template.

[floryst]

Yeah, you should be able to exclude the CSS rules for your angular project.

On September 3, 2020 8:42:31 PM UTC, Mohammad Ali Ghaderi [e-mail] wrote:

@floryst Thanks for your sample angular code.

I have a lot of other rules in my webpack and didn’t want to override all rules. So, I solved my problem by adding your rules to it:

` const vtkRules = require(‘vtk.js/Utilities/config/dependency’).webpack;

 Array.prototype.push.apply(cfg.module.rules, vtkRules.core.rules)

`

But adding css rules will break the build

Array.prototype.push.apply(cfg.module.rules, vtkRules.css.rules)

I assume we don’t need css rules and all js rules will only apply to vtk.js. Right?

– You are receiving this because you were mentioned. Reply to this email directly or view it on GitHub: https://github.com/Kitware/vtk-js/issues/1003#issuecomment-686754490