建立自定義nvd3版本的建議方法是什麼？

Question

NVD3包含十幾種做圖表的方式，壓縮前500KB。我想找到修剪這個文件的方法，特別是因爲我們只使用線條和條形圖。

建立模塊化NVD3庫的建議方法是什麼？

Answer 1

我修改了不需要grunt file註釋掉的一切：

src: [ 
    'src/intro.js', 
    'src/core.js', 
    'src/interactiveLayer.js', 
    'src/tooltip.js', 
    'src/utils.js', 
    'src/models/axis.js', 
    // 'src/models/historicalBar.js', 
    // 'src/models/bullet.js', 
    // 'src/models/bulletChart.js', 
    // 'src/models/cumulativeLineChart.js', 
    // 'src/models/discreteBar.js', 
    // 'src/models/discreteBarChart.js', 
    // 'src/models/distribution.js', 
    'src/models/historicalBar.js', 
    // 'src/models/historicalBarChart.js', 
    // 'src/models/indentedTree.js', 
    'src/models/legend.js', 
    'src/models/line.js', 
    // 'src/models/lineChart.js', 
    'src/models/linePlusBarChart.js', 
    // 'src/models/lineWithFocusChart.js', 
    // 'src/models/linePlusBarWithFocusChart.js', 
    // 'src/models/multiBar.js', 
    // 'src/models/multiBarChart.js', 
    // 'src/models/multiBarHorizontal.js', 
    // 'src/models/multiBarHorizontalChart.js', 
    // 'src/models/multiChart.js', 
    // 'src/models/ohlcBar.js', 
    // 'src/models/pie.js', 
    // 'src/models/pieChart.js', 
    'src/models/scatter.js', 
    // 'src/models/scatterChart.js', 
    // 'src/models/scatterPlusLineChart.js', 
    // 'src/models/sparkline.js', 
    // 'src/models/sparklinePlus.js', 
    // 'src/models/stackedArea.js', 
    // 'src/models/stackedAreaChart.js', 
    'src/outro.js' 
    ] 

這工作，但基於模塊（browserify，AMD ...）將是首選更好的解決方案。

Answer 2

所以在v1.8.2更新之後gruntfile已經改變了一點。您將不會再看到js文件列表。代替它，你會看到'src/models/*.js',

我正在創建所選答案後的自定義生成。因此，爲了創建它，我遍歷每個圖表模塊並記下它們正在使用的模型。稍後我將這些js-files添加到concat.js.src對象Gruntfile.js。以下是大多數通用LineChart的示例：

concat: { 
    ... 
    js: { 
     options: { 
      ... 
     }, 
     src: [ 
     'src/core.js', 
     'src/dom.js', 
     'src/interactiveLayer.js', 
     'src/tooltip.js', 
     'src/utils.js', 
     //Include all files in src/models 
     // 'src/models/*.js', 
     // example to exclude files: '!src/models/excludeMe*' 
     'src/models/axis.js', 
     'src/models/legend.js', 
     'src/models/line.js', 
     'src/models/lineChart.js', 
     'src/models/scatter.js', 
     ], 
     ... 
    } 
},