CanJS provides an ES module that contains named exports which can be imported and used to pluck out the parts that you need. When used in conjunction with tree shaking you gain:

• Fewer packages to import in each of your modules.
• Bundles that exclude all of the parts of CanJS that you don't use.

To use, import the can/es module like so:

import { Component, DefineMap } from "can/es";

const ViewModel = DefineMap.extend({
    message: "string"
});

Component.extend({
    tag: "my-component",
    ViewModel
});

If you are using webpack tree-shaking is only available when in production mode. The following config shows a typical setup:

webpack.config.js

const path = require('path');

module.exports = {
  entry: './index.js',
  mode: 'production',
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname)
  }
};

Names

The names that can be imported from this module mirror what is part of the can namespace object that you get from import can from "can". You can see the names that can/es exports here.