Geek Answers Handbook

Use vtk.js / glsl files in angular cli application

I am trying to use vtk.js in my angular cli application and added vtk.js to my angular-cli.json.

ERROR in ./node_modules/vtk.js/Sources/Rendering/OpenGL/glsl/vtkVolumeVS.glsl Module parse failed: Unexpected token (18:10) You may need an appropriate loader to handle this file type....

How can I use glsl loader with angular cli?

Of course, without throwing out angular cli.

+7
angular angular-cli
source share
2 answers

I found a solution here . You do not need to fetch, since Angular 6 has disabled the outlier. Just follow the article and the content of extra-webpack.config.js as follows:

  module.exports = { module: { rules: [ { test: /\.glsl$/i, include: /node_modules(\/|\\)vtk\.js(\/|\\)/, loader: 'shader-loader', }, { test: /\.js$/, include: /node_modules(\/|\\)vtk\.js(\/|\\)/, loader: 'babel-loader?presets[]=env', }, { test: /\.worker\.js$/, include: /node_modules(\/|\\)vtk\.js(\/|\\)/, use: [ { loader: 'worker-loader', options: { inline: true, fallback: false }, }, ], }, ], }, };

Of course, you should install the vtk.js and kw-web-suit dependencies. Then it must be successfully compiled. if you encounter an error that says "global is not defined" in browser developer mode, then add (window as any).global = window; Corner polyfills.ts . It works for me on Angular 6 with the latest vtk.js.

+3
source share

Can you try using the vtk.js pre-build umd version?

+1
source share

More articles:


All Articles