SystemJS package config path map for subdirectory

Question

I'm struggling with mapping path for systemjs.

Below is my current configuration. I want @angular-redux/form/dist/source/connect to be @angular-redux/form/dist/source/connect/index.js

but it keeps directing to @angular-redux/form/dist/source/connect.js

I'm assuming I'm not writing correct map or I should be using meta instead... Could someone walk me through?

'use strict';
/**
 * System configuration for Angular samples
 * Adjust as necessary for your application needs.
 */
(function () {
  System.config({
    paths: {
      // paths serve as alias
      'npm:': '../node_modules/'
    },
    // map tells the System loader where to look for things
    map: {
      "@angular-redux/form": "npm:@angular-redux/form"
    },
    // packages tells the System loader how to load when no filename and/or no extension
    packages: {
      '@angular-redux/form': {
        main: 'dist/source/index.js',
        map: {
          './connect': './connect/index.js',
          './connect-array': './connect-array/index.js'
        }
      }
    }
  });
})(this);

Answer 1

I don't think you are mapping to the correct location.

if you have

import '@angular-redux/form/dist/source/connect'

the mapping needs to be something akin to this:

'./dist/source/connect': './dist/source/connect/index.js',
'./dist/source/connect-array': './dist/source/connect-array/index.js'

if you have

import '@angular-redux/form/connect'

the mapping needs to be something akin to this:

'./connect': './dist/source/connect/index.js',
'./connect-array': './dist/source/connect-array/index.js'