OpenCascade.js

A port of the OpenCascade CAD library to JavaScript and WebAssembly via Emscripten.
Explore the docs »

Examples · Issues · Discuss

Projects & Examples:

• CascadeStudio is a SCAD (Scripted-Computer-Aided-Design) editor, which runs in the browser.
• OpenCascade.js-examples contains general examples on how to use the library.

Getting Started

(These instructions are for the upcoming @beta release. All information is likely to change. See here for instructions of the v1.1.1 release.)

1. Add the library as a dependency to your project

   npm install opencascade.js@beta
   

Option A: If you're using a bundler like Webpack (browser-based and server-side applications)

2. Configure your bundler to load .wasm files as URLs. If you don't want to use a bundler, you can manually pass in the URLs to the WASM files in the next step.

   For webpack, first add the file-loader dependency.

   npm install file-loader --save-dev
   

   Then add the following configuration to your webpack.config.js.

   module: {
     rules: [
       {
         test: /\.wasm$/,
         type: "javascript/auto",
         loader: "file-loader"
       }
     ]
   },
   // For Webpack 4, you have to add the following properties to the "node" object (e.g. Create-React-App, ...)
   node: {
     fs: "empty"
   }
   // For Webpack 5, you you have to add the following properties to the "fallback" object (e.g. NextJs, ...)
   fallback: {
     fs: false,
     perf_hooks: false,
     os: false,
     worker_threads: false,
     crypto: false,
     stream: false
   }
   

   If you're using create-react-app, you'll need to install react-app-rewired, then save the following as config-overrides.js

   module.exports = {
     webpack: (config) => {
       config.module.rules.find(k => k.oneOf !== undefined).oneOf.unshift(
         {
           test: /\.wasm$/,
           type: "javascript/auto",
           loader: "file-loader",
           options: {
             name: "static/js/[name].[contenthash:8].[ext]",
           },
         }
       );
       return config;
     },
   };
   

   A CRA+opencascade.js reference example is available here.

3. In your JavaScript file, instantiate the library:

   import initOpenCascade from "opencascade.js";
   
   initOpenCascade().then(oc => {
     // Check out the examples on how to use this library!
   });
   

Option B: If you're using Node.js without a bundler in a server-side application

2. In this case, you can import the library directly without having to configure your bundler

   import initOpenCascade from "opencascade.js/dist/node.js";
   
   initOpenCascade().then(oc => {
     // Check out the examples on how to use this library!
   });
   

FAQ

Is this a fork of the OpenCascade library?

No. This project is making no changes to the OpenCascade library, apart from few very small modifications which are applied as patches. All this project does is

• Download a tagged commit from the OpenCascade git server.
• Compile the OpenCascade library using the Emscripten compiler.
• Analyze the OpenCascade headers using libclang and auto-generate bind-code to expose the library to JavaScript.
• Link the WASM-binaries and provide some convenience functions so that you can easily use the library in your JavaScript projects.

Who is going to keep this project up-to-date with the OpenCascade library?

This project is (hopefully) keeping itself (mostly) up-to-date with the OpenCascade library, since most bindings are generated automatically.

Contributing

Contributions are welcome! Feel free to have a look at the todo-list if you need some inspiration on what else needs to be done.