Accessing dc.js and crossfilter with RequireJS
<p>I am trying to import dc and cross filter into my environment using require js.</p>

<p>I am using the following code in my js file:</p>

<pre><code>    require.config({
    paths: {

       "crossfilter": "https://cdnjs.cloudflare.com/ajax/libs/crossfilter/1.3.7/crossfilter",
       "d3": "https://cdnjs.cloudflare.com/ajax/libs/d3/4.4.0/d3",
       "dc": "https://cdnjs.cloudflare.com/ajax/libs/dc/2.1.0-dev/dc"
    }
}); 
require(['crossfilter','d3','dc'], function(){

    console.log("alert");
    });
</code></pre>

<p>However i am getting an error in my console.
<a href="https://i.stack.imgur.com/ycoT0.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ycoT0.png" alt="enter image description here"></a>
On some further probing it seems that the utils.js file is throwing up an error in the first line which is :
<a href="https://i.stack.imgur.com/sCzU7.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/sCzU7.png" alt="enter image description here"></a></p>

<p>I have not included the utils.js anywhere in my code. I am guessing that it is being auto delivered from the cdn.</p>

<p>if i call the requireJS dependenices without the dc.js file, the crossfilter and d3 dont throw an error when i load my page.
What could i possibly be missing?</p>

<p><strong>EDIT:</strong>
I backported to d3 v3.5 and this problem got solved. 
Now however i am not able to access the dc object when calling the charts. I can see this error in the console. I even added a dependency on d3 while calling the dc Shim but it did not work. Here is my html and JS code. I would have shared a JS Fiddle but not sure if it can be debugged via console.</p>

<p><strong>HTML CODE</strong></p>

<pre><code>&lt;!DOCTYPE HTML&gt;
&lt;html&gt;
    &lt;head&gt;
        &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8"&gt;
        &lt;title&gt;Require js&lt;/title&gt;

        &lt;!-- 1. Add these JavaScript inclusions in the head of your page --&gt;
        &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"&gt;&lt;/script&gt;

        &lt;link rel="stylesheet" href="required.css" /&gt;

    &lt;/head&gt;
    &lt;body&gt;
        &lt;!-- 3. Add the container --&gt;
        &lt;div id="container" style="width: 800px; height: 400px; margin: 0 auto"&gt;&lt;/div&gt;

    &lt;script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.2/require.js"&gt;&lt;/script&gt;

    &lt;script src='required.js' type='text/javascript'&gt;&lt;/script&gt;  
    &lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p><strong>JS CODE</strong></p>

<pre><code>    require.config({
    paths: {

       "crossfilter": "https://cdnjs.cloudflare.com/ajax/libs/crossfilter/1.3.5/crossfilter",
       "d3": "https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.3/d3",
       "dc": "https://cdnjs.cloudflare.com/ajax/libs/dc/2.1.0-dev/dc"
    },
    shim:{
       'dc':{
         deps:['d3'],
         exports:'dc'
        } 
    }
});

    data = [{
      "name":"anmol",
      "age":"27",
      "salary": "less"
    }]
    require(['crossfilter','d3','dc'], function(){
        console.log(data);
    $(document.body).append('&lt;div id="funding-chart"&gt;&lt;/div&gt;');
    var ndx = crossfilter(data);
    var fundingStatus = ndx.dimension(function(d) { return d.funding_status; });
    var projectsByFundingStatus = fundingStatus.group();
    var hutu = fundingStatus.top(Infinity);
    console.log(hutu);
    var fundingStatusChart = dc.pieChart("#funding-chart");
              fundingStatusChart
                .height(220)
                //.width(350)
                .radius(90)
                .innerRadius(40)
                .transitionDuration(1000)
                .dimension(fundingStatus)
                .group(projectsByFundingStatus);
      dc.renderAll();
        });
</code></pre>

<p>Any help is much appreciated. </p>