Understanding JSPM configuration file

• In my previous post we have introduced with JSPM package manager and learnt to install and initialize it for an application.
• In this demo, “We will learn about properties present inside config.js file”.
• On successful initialization it creates a config.js file and jspm_packages directory.The following screenshot shows the project structure with config.js and jspm_packages directory created inside.

• The config.js file contains code related to configuration of project and JSPM modules.The content of config.js file are as follows:-

System.config({
  defaultJSExtensions: true,
  transpiler: "babel",
  babelOptions: {
    "optional": [
      "runtime",
      "optimisation.modules.system"
    ]
  },
  paths: {
    "github:*": "jspm_packages/github/*",
    "npm:*": "jspm_packages/npm/*"
  },

  map: {
    "babel": "npm:babel-core@5.8.23",
    "babel-runtime": "npm:babel-runtime@5.8.20",
    "core-js": "npm:core-js@1.1.3",
    "github:jspm/nodelibs-process@0.1.1": {
      "process": "npm:process@0.10.1"
    },
    "npm:babel-runtime@5.8.20": {
      "process": "github:jspm/nodelibs-process@0.1.1"
    },
    "npm:core-js@1.1.3": {
      "fs": "github:jspm/nodelibs-fs@0.1.2",
      "process": "github:jspm/nodelibs-process@0.1.1",
      "systemjs-json": "github:systemjs/plugin-json@0.1.0"
    }
  }
});

• The properties present inside config.js file are babelOptions, bundle, defaultJSExtensions, depCache, map, meta, packages, paths, traceurOptions, transpiler and typescriptOptions.
• babelOptions: This property takes the Babel transpiler configuration.
• bundle: This property takes a collection of modules to be downloaded together as a package.
• defaultJSExtensions: This property takes a file extension that will be added to the file.
• depCache: This property takes the dependencies files and loads it progressively.
• map: This property maps a module alias to a location or package.
• meta: This property provides the way it load the library.It means the library can be loaded as Global.
• packages: This property is used for setting meta and map configuration.
• paths: This property takes the path strings for normalization.
• traceurOptions: This property takes the option for traceur.
• transpiler: It takes the module name of the transpiler to be used for loading ES6 modules.
• typeScriptOption: It takes the configuration for typescript transpiler.