RequireJS Module ID not loaded

[Koshux]

I am trying to load the chartjs-plugin-zoom library using RequireJS. The problem I face is that this library attempts to load the ChartJS library using the module ID chart.js (as shown here) but it actually fails to load the library.

Now, as specified by RequireJS docs here:

There may be times when you do want to reference a script directly and not conform to the "baseUrl + paths" rules for finding it. If a module ID has one of the following characteristics, the ID will not be passed through the "baseUrl + paths" configuration, and just be treated like a regular URL that is relative to the document:

• Ends in ".js".
• Starts with a "/".
• Contains an URL protocol, like "http:" or "https:"

You cannot load a library with a module ID that ends with .js extension. Having followed this jtblin/angular-chart.js#147 issue, it appears to be a common problem amongst developers using RequireJS.

[Koshux]

Bumping this issue.

[Koshux]

@etimberg ping

[compwright]

@Koshux the industry seems to be moving away from RequireJS towards newer and better technologies like Webpack. Given that there are other ways to make this work, this particular issue isn't really at the top of the priority scale--this plugin has much bigger issues with functionality, as you can see from the issues list. If you need this fixed now, please consider submitting a PR. Thanks!

[simonbrunel]

@Koshux I'm curious to know if this issue also happens with the chartjs-plugin-deferred plugin?

[simonbrunel]

@Koshux can you try with these files: chartjs-plugin-zoom.zip

[Koshux]

@simonbrunel I have tried using both files provided in the ZIP file (chartjs-plugin-zoom.js & chartjs-plugin-zoom.min.js) and still encounter the same issue. The working solution is to change the expected module ID from 'require('chart.js')' to 'require('chartjs')'.

[simonbrunel]

Can you share test cases that fail to load chart.js and another one that work with chartjs?

[simonbrunel]

Also, if chart.js is renamed to chartjs, how this will work with other module loaders?

[ghost]

Bumbing this up since this is a breaking issue with requirejs.

[jbsgh]

My require.config.js looks like this:

require.config({
	paths: {
		moment: 'lib/moment.js/moment-with-locales.min',
		chartjs: 'lib/chart.js/Chart'
	},
	map: {
		'*': {
			'chart.js': 'chartjs'
		}
	},
	shim: {
		'chartjs': {
			deps: ['moment']
		}
	}
});

The trick is to map the module-name "chart.js" including the .js-suffix to the module-name "chartjs". This configuration allows RequireJS to load chart.js-plugins without any modification.

[mortac8]

I fought with this for hours when trying to use the dragdata extension. I ended up doing the following at the top of my js class to ensure chartjs (2.9.3) is loaded before the dragdata (1.0.2) extension.

require.config({
    shim: {
        "myapp/js/chartjs/chartjs-plugin-dragdata": ["myapp/js/chartjs/Chart"]
    }
});