我试图将d3.js与aurelia.io,
一起使用我在这里找到了一个骨架,但它已经过时了https://github.com/shmendo/aurelia-d3-skeleton
我用jspm安装它,并安装了大约20个不同的包
jspm install d3
有没有办法只安装一个大包,因为我在导入时遇到问题
我可以像这样导入d3
从' d3';
导入*作为d3但调用时间模块会导致页面加载错误
var parseDate = d3.time.format("%d-%b-%y").parse;
aurelia-logging-console.js:54 ERROR [app-router] Error: (SystemJS) XHR error (404 Not Found) loading http://host/d3-time.js
Error: XHR error (404 Not Found) loading http://host/d3-time.js
不知道为什么,我的config.js文件似乎正确配置为映射d3-time
System.config({
baseURL: "/",
defaultJSExtensions: true,
transpiler: "babel",
babelOptions: {
"optional": [
"runtime",
"es7.decorators",
"optimisation.modules.system"
]
},
paths: {
"github:*": "jspm_packages/github/*",
"npm:*": "jspm_packages/npm/*"
},
map: {
"aurelia-bootstrapper": "npm:aurelia-bootstrapper@1.0.0",
"babel": "npm:babel-core@5.8.38",
"babel-runtime": "npm:babel-runtime@5.8.38",
"core-js": "npm:core-js@1.2.7",
"d3": "npm:d3@4.2.2",
"socket.io-client": "npm:socket.io-client@1.4.8",
"github:jspm/nodelibs-assert@0.1.0": {
"assert": "npm:assert@1.4.1"
},
"github:jspm/nodelibs-buffer@0.1.0": {
"buffer": "npm:buffer@3.6.0"
},
"github:jspm/nodelibs-events@0.1.1": {
"events": "npm:events@1.0.2"
},
"github:jspm/nodelibs-http@1.7.1": {
"Base64": "npm:Base64@0.2.1",
"events": "github:jspm/nodelibs-events@0.1.1",
"inherits": "npm:inherits@2.0.1",
"stream": "github:jspm/nodelibs-stream@0.1.0",
"url": "github:jspm/nodelibs-url@0.1.0",
"util": "github:jspm/nodelibs-util@0.1.0"
},
"github:jspm/nodelibs-https@0.1.0": {
"https-browserify": "npm:https-browserify@0.0.0"
},
"github:jspm/nodelibs-path@0.1.0": {
"path-browserify": "npm:path-browserify@0.0.0"
},
"github:jspm/nodelibs-process@0.1.2": {
"process": "npm:process@0.11.9"
},
"github:jspm/nodelibs-stream@0.1.0": {
"stream-browserify": "npm:stream-browserify@1.0.0"
},
"github:jspm/nodelibs-url@0.1.0": {
"url": "npm:url@0.10.3"
},
"github:jspm/nodelibs-util@0.1.0": {
"util": "npm:util@0.10.3"
},
"github:jspm/nodelibs-vm@0.1.0": {
"vm-browserify": "npm:vm-browserify@0.0.4"
},
"npm:assert@1.4.1": {
"assert": "github:jspm/nodelibs-assert@0.1.0",
"buffer": "github:jspm/nodelibs-buffer@0.1.0",
"process": "github:jspm/nodelibs-process@0.1.2",
"util": "npm:util@0.10.3"
},
"npm:aurelia-binding@1.0.3": {
"aurelia-logging": "npm:aurelia-logging@1.0.0",
"aurelia-metadata": "npm:aurelia-metadata@1.0.0",
"aurelia-pal": "npm:aurelia-pal@1.0.0",
"aurelia-task-queue": "npm:aurelia-task-queue@1.0.0"
},
"npm:aurelia-bootstrapper@1.0.0": {
"aurelia-event-aggregator": "npm:aurelia-event-aggregator@1.0.0",
"aurelia-framework": "npm:aurelia-framework@1.0.2",
"aurelia-history": "npm:aurelia-history@1.0.0",
"aurelia-history-browser": "npm:aurelia-history-browser@1.0.0",
"aurelia-loader-default": "npm:aurelia-loader-default@1.0.0",
"aurelia-logging-console": "npm:aurelia-logging-console@1.0.0",
"aurelia-pal": "npm:aurelia-pal@1.0.0",
"aurelia-pal-browser": "npm:aurelia-pal-browser@1.0.0",
"aurelia-polyfills": "npm:aurelia-polyfills@1.0.0",
"aurelia-router": "npm:aurelia-router@1.0.2",
"aurelia-templating": "npm:aurelia-templating@1.0.1",
"aurelia-templating-binding": "npm:aurelia-templating-binding@1.0.0",
"aurelia-templating-resources": "npm:aurelia-templating-resources@1.0.0",
"aurelia-templating-router": "npm:aurelia-templating-router@1.0.0"
},
"npm:aurelia-dependency-injection@1.0.0": {
"aurelia-metadata": "npm:aurelia-metadata@1.0.0",
"aurelia-pal": "npm:aurelia-pal@1.0.0"
},
"npm:aurelia-event-aggregator@1.0.0": {
"aurelia-logging": "npm:aurelia-logging@1.0.0"
},
"npm:aurelia-framework@1.0.2": {
"aurelia-binding": "npm:aurelia-binding@1.0.3",
"aurelia-dependency-injection": "npm:aurelia-dependency-injection@1.0.0",
"aurelia-loader": "npm:aurelia-loader@1.0.0",
"aurelia-logging": "npm:aurelia-logging@1.0.0",
"aurelia-metadata": "npm:aurelia-metadata@1.0.0",
"aurelia-pal": "npm:aurelia-pal@1.0.0",
"aurelia-path": "npm:aurelia-path@1.0.0",
"aurelia-task-queue": "npm:aurelia-task-queue@1.0.0",
"aurelia-templating": "npm:aurelia-templating@1.0.1"
},
"npm:aurelia-history-browser@1.0.0": {
"aurelia-history": "npm:aurelia-history@1.0.0",
"aurelia-pal": "npm:aurelia-pal@1.0.0"
},
"npm:aurelia-loader-default@1.0.0": {
"aurelia-loader": "npm:aurelia-loader@1.0.0",
"aurelia-metadata": "npm:aurelia-metadata@1.0.0",
"aurelia-pal": "npm:aurelia-pal@1.0.0"
},
"npm:aurelia-loader@1.0.0": {
"aurelia-metadata": "npm:aurelia-metadata@1.0.0",
"aurelia-path": "npm:aurelia-path@1.0.0"
},
"npm:aurelia-logging-console@1.0.0": {
"aurelia-logging": "npm:aurelia-logging@1.0.0"
},
"npm:aurelia-metadata@1.0.0": {
"aurelia-pal": "npm:aurelia-pal@1.0.0"
},
"npm:aurelia-pal-browser@1.0.0": {
"aurelia-pal": "npm:aurelia-pal@1.0.0"
},
"npm:aurelia-polyfills@1.0.0": {
"aurelia-pal": "npm:aurelia-pal@1.0.0"
},
"npm:aurelia-route-recognizer@1.0.0": {
"aurelia-path": "npm:aurelia-path@1.0.0"
},
"npm:aurelia-router@1.0.2": {
"aurelia-dependency-injection": "npm:aurelia-dependency-injection@1.0.0",
"aurelia-event-aggregator": "npm:aurelia-event-aggregator@1.0.0",
"aurelia-history": "npm:aurelia-history@1.0.0",
"aurelia-logging": "npm:aurelia-logging@1.0.0",
"aurelia-path": "npm:aurelia-path@1.0.0",
"aurelia-route-recognizer": "npm:aurelia-route-recognizer@1.0.0"
},
"npm:aurelia-task-queue@1.0.0": {
"aurelia-pal": "npm:aurelia-pal@1.0.0"
},
"npm:aurelia-templating-binding@1.0.0": {
"aurelia-binding": "npm:aurelia-binding@1.0.3",
"aurelia-logging": "npm:aurelia-logging@1.0.0",
"aurelia-templating": "npm:aurelia-templating@1.0.1"
},
"npm:aurelia-templating-resources@1.0.0": {
"aurelia-binding": "npm:aurelia-binding@1.0.3",
"aurelia-dependency-injection": "npm:aurelia-dependency-injection@1.0.0",
"aurelia-loader": "npm:aurelia-loader@1.0.0",
"aurelia-logging": "npm:aurelia-logging@1.0.0",
"aurelia-metadata": "npm:aurelia-metadata@1.0.0",
"aurelia-pal": "npm:aurelia-pal@1.0.0",
"aurelia-path": "npm:aurelia-path@1.0.0",
"aurelia-task-queue": "npm:aurelia-task-queue@1.0.0",
"aurelia-templating": "npm:aurelia-templating@1.0.1"
},
"npm:aurelia-templating-router@1.0.0": {
"aurelia-dependency-injection": "npm:aurelia-dependency-injection@1.0.0",
"aurelia-logging": "npm:aurelia-logging@1.0.0",
"aurelia-metadata": "npm:aurelia-metadata@1.0.0",
"aurelia-pal": "npm:aurelia-pal@1.0.0",
"aurelia-path": "npm:aurelia-path@1.0.0",
"aurelia-router": "npm:aurelia-router@1.0.2",
"aurelia-templating": "npm:aurelia-templating@1.0.1"
},
"npm:aurelia-templating@1.0.1": {
"aurelia-binding": "npm:aurelia-binding@1.0.3",
"aurelia-dependency-injection": "npm:aurelia-dependency-injection@1.0.0",
"aurelia-loader": "npm:aurelia-loader@1.0.0",
"aurelia-logging": "npm:aurelia-logging@1.0.0",
"aurelia-metadata": "npm:aurelia-metadata@1.0.0",
"aurelia-pal": "npm:aurelia-pal@1.0.0",
"aurelia-path": "npm:aurelia-path@1.0.0",
"aurelia-task-queue": "npm:aurelia-task-queue@1.0.0"
},
"npm:babel-runtime@5.8.38": {
"process": "github:jspm/nodelibs-process@0.1.2"
},
"npm:benchmark@1.0.0": {
"process": "github:jspm/nodelibs-process@0.1.2"
},
"npm:better-assert@1.0.2": {
"assert": "github:jspm/nodelibs-assert@0.1.0",
"callsite": "npm:callsite@1.0.0",
"fs": "github:jspm/nodelibs-fs@0.1.2",
"process": "github:jspm/nodelibs-process@0.1.2"
},
"npm:buffer@3.6.0": {
"base64-js": "npm:base64-js@0.0.8",
"child_process": "github:jspm/nodelibs-child_process@0.1.0",
"fs": "github:jspm/nodelibs-fs@0.1.2",
"ieee754": "npm:ieee754@1.1.6",
"isarray": "npm:isarray@1.0.0",
"process": "github:jspm/nodelibs-process@0.1.2"
},
"npm:core-js@1.2.7": {
"fs": "github:jspm/nodelibs-fs@0.1.2",
"path": "github:jspm/nodelibs-path@0.1.0",
"process": "github:jspm/nodelibs-process@0.1.2",
"systemjs-json": "github:systemjs/plugin-json@0.1.2"
},
"npm:core-util-is@1.0.2": {
"buffer": "github:jspm/nodelibs-buffer@0.1.0"
},
"npm:d3-brush@1.0.2": {
"d3-dispatch": "npm:d3-dispatch@1.0.1",
"d3-drag": "npm:d3-drag@1.0.1",
"d3-interpolate": "npm:d3-interpolate@1.1.1",
"d3-selection": "npm:d3-selection@1.0.2",
"d3-transition": "npm:d3-transition@1.0.1"
},
"npm:d3-chord@1.0.2": {
"d3-array": "npm:d3-array@1.0.1",
"d3-path": "npm:d3-path@1.0.1"
},
"npm:d3-drag@1.0.1": {
"d3-dispatch": "npm:d3-dispatch@1.0.1",
"d3-selection": "npm:d3-selection@1.0.2"
},
"npm:d3-dsv@1.0.1": {
"rw": "npm:rw@1.3.2"
},
"npm:d3-force@1.0.2": {
"d3-collection": "npm:d3-collection@1.0.1",
"d3-dispatch": "npm:d3-dispatch@1.0.1",
"d3-quadtree": "npm:d3-quadtree@1.0.1",
"d3-timer": "npm:d3-timer@1.0.2",
"process": "github:jspm/nodelibs-process@0.1.2"
},
"npm:d3-geo@1.2.3": {
"buffer": "github:jspm/nodelibs-buffer@0.1.0",
"d3-array": "npm:d3-array@1.0.1"
},
"npm:d3-interpolate@1.1.1": {
"d3-color": "npm:d3-color@1.0.1"
},
"npm:d3-request@1.0.2": {
"d3-collection": "npm:d3-collection@1.0.1",
"d3-dispatch": "npm:d3-dispatch@1.0.1",
"d3-dsv": "npm:d3-dsv@1.0.1",
"xmlhttprequest": "npm:xmlhttprequest@1.8.0"
},
"npm:d3-scale@1.0.3": {
"d3-array": "npm:d3-array@1.0.1",
"d3-collection": "npm:d3-collection@1.0.1",
"d3-color": "npm:d3-color@1.0.1",
"d3-format": "npm:d3-format@1.0.2",
"d3-interpolate": "npm:d3-interpolate@1.1.1",
"d3-time": "npm:d3-time@1.0.2",
"d3-time-format": "npm:d3-time-format@2.0.2"
},
"npm:d3-shape@1.0.2": {
"d3-path": "npm:d3-path@1.0.1"
},
"npm:d3-time-format@2.0.2": {
"d3-time": "npm:d3-time@1.0.2"
},
"npm:d3-transition@1.0.1": {
"d3-color": "npm:d3-color@1.0.1",
"d3-dispatch": "npm:d3-dispatch@1.0.1",
"d3-ease": "npm:d3-ease@1.0.1",
"d3-interpolate": "npm:d3-interpolate@1.1.1",
"d3-selection": "npm:d3-selection@1.0.2",
"d3-timer": "npm:d3-timer@1.0.2"
},
"npm:d3-zoom@1.0.3": {
"d3-dispatch": "npm:d3-dispatch@1.0.1",
"d3-drag": "npm:d3-drag@1.0.1",
"d3-interpolate": "npm:d3-interpolate@1.1.1",
"d3-selection": "npm:d3-selection@1.0.2",
"d3-transition": "npm:d3-transition@1.0.1"
},
"npm:d3@4.2.2": {
"buffer": "github:jspm/nodelibs-buffer@0.1.0",
"d3-array": "npm:d3-array@1.0.1",
"d3-axis": "npm:d3-axis@1.0.3",
"d3-brush": "npm:d3-brush@1.0.2",
"d3-chord": "npm:d3-chord@1.0.2",
"d3-collection": "npm:d3-collection@1.0.1",
"d3-color": "npm:d3-color@1.0.1",
"d3-dispatch": "npm:d3-dispatch@1.0.1",
"d3-drag": "npm:d3-drag@1.0.1",
"d3-dsv": "npm:d3-dsv@1.0.1",
"d3-ease": "npm:d3-ease@1.0.1",
"d3-force": "npm:d3-force@1.0.2",
"d3-format": "npm:d3-format@1.0.2",
"d3-geo": "npm:d3-geo@1.2.3",
"d3-hierarchy": "npm:d3-hierarchy@1.0.2",
"d3-interpolate": "npm:d3-interpolate@1.1.1",
"d3-path": "npm:d3-path@1.0.1",
"d3-polygon": "npm:d3-polygon@1.0.1",
"d3-quadtree": "npm:d3-quadtree@1.0.1",
"d3-queue": "npm:d3-queue@3.0.2",
"d3-random": "npm:d3-random@1.0.1",
"d3-request": "npm:d3-request@1.0.2",
"d3-scale": "npm:d3-scale@1.0.3",
"d3-selection": "npm:d3-selection@1.0.2",
"d3-shape": "npm:d3-shape@1.0.2",
"d3-time": "npm:d3-time@1.0.2",
"d3-time-format": "npm:d3-time-format@2.0.2",
"d3-timer": "npm:d3-timer@1.0.2",
"d3-transition": "npm:d3-transition@1.0.1",
"d3-voronoi": "npm:d3-voronoi@1.0.2",
"d3-zoom": "npm:d3-zoom@1.0.3",
"process": "github:jspm/nodelibs-process@0.1.2"
},
"npm:debug@2.2.0": {
"ms": "npm:ms@0.7.1"
},
"npm:engine.io-client@1.6.11": {
"buffer": "github:jspm/nodelibs-buffer@0.1.0",
"component-emitter": "npm:component-emitter@1.1.2",
"component-inherit": "npm:component-inherit@0.0.3",
"debug": "npm:debug@2.2.0",
"engine.io-parser": "npm:engine.io-parser@1.2.4",
"has-cors": "npm:has-cors@1.1.0",
"indexof": "npm:indexof@0.0.1",
"parsejson": "npm:parsejson@0.0.1",
"parseqs": "npm:parseqs@0.0.2",
"parseuri": "npm:parseuri@0.0.4",
"yeast": "npm:yeast@0.1.2"
},
"npm:engine.io-parser@1.2.4": {
"after": "npm:after@0.8.1",
"arraybuffer.slice": "npm:arraybuffer.slice@0.0.6",
"base64-arraybuffer": "npm:base64-arraybuffer@0.1.2",
"blob": "npm:blob@0.0.4",
"buffer": "github:jspm/nodelibs-buffer@0.1.0",
"has-binary": "npm:has-binary@0.1.6",
"utf8": "npm:utf8@2.1.0"
},
"npm:has-binary@0.1.6": {
"buffer": "github:jspm/nodelibs-buffer@0.1.0",
"fs": "github:jspm/nodelibs-fs@0.1.2",
"isarray": "npm:isarray@0.0.1"
},
"npm:has-binary@0.1.7": {
"buffer": "github:jspm/nodelibs-buffer@0.1.0",
"fs": "github:jspm/nodelibs-fs@0.1.2",
"isarray": "npm:isarray@0.0.1"
},
"npm:https-browserify@0.0.0": {
"http": "github:jspm/nodelibs-http@1.7.1"
},
"npm:inherits@2.0.1": {
"util": "github:jspm/nodelibs-util@0.1.0"
},
"npm:parsejson@0.0.1": {
"better-assert": "npm:better-assert@1.0.2"
},
"npm:parseqs@0.0.2": {
"better-assert": "npm:better-assert@1.0.2"
},
"npm:parseuri@0.0.4": {
"better-assert": "npm:better-assert@1.0.2"
},
"npm:path-browserify@0.0.0": {
"process": "github:jspm/nodelibs-process@0.1.2"
},
"npm:process@0.11.9": {
"assert": "github:jspm/nodelibs-assert@0.1.0",
"fs": "github:jspm/nodelibs-fs@0.1.2",
"vm": "github:jspm/nodelibs-vm@0.1.0"
},
"npm:punycode@1.3.2": {
"process": "github:jspm/nodelibs-process@0.1.2"
},
"npm:readable-stream@1.1.14": {
"buffer": "github:jspm/nodelibs-buffer@0.1.0",
"core-util-is": "npm:core-util-is@1.0.2",
"events": "github:jspm/nodelibs-events@0.1.1",
"inherits": "npm:inherits@2.0.1",
"isarray": "npm:isarray@0.0.1",
"process": "github:jspm/nodelibs-process@0.1.2",
"stream-browserify": "npm:stream-browserify@1.0.0",
"string_decoder": "npm:string_decoder@0.10.31"
},
"npm:rw@1.3.2": {
"buffer": "github:jspm/nodelibs-buffer@0.1.0",
"fs": "github:jspm/nodelibs-fs@0.1.2",
"process": "github:jspm/nodelibs-process@0.1.2"
},
"npm:socket.io-client@1.4.8": {
"backo2": "npm:backo2@1.0.2",
"buffer": "github:jspm/nodelibs-buffer@0.1.0",
"component-bind": "npm:component-bind@1.0.0",
"component-emitter": "npm:component-emitter@1.2.0",
"debug": "npm:debug@2.2.0",
"engine.io-client": "npm:engine.io-client@1.6.11",
"has-binary": "npm:has-binary@0.1.7",
"indexof": "npm:indexof@0.0.1",
"object-component": "npm:object-component@0.0.3",
"parseuri": "npm:parseuri@0.0.4",
"socket.io-parser": "npm:socket.io-parser@2.2.6",
"to-array": "npm:to-array@0.1.4"
},
"npm:socket.io-parser@2.2.6": {
"benchmark": "npm:benchmark@1.0.0",
"buffer": "github:jspm/nodelibs-buffer@0.1.0",
"component-emitter": "npm:component-emitter@1.1.2",
"debug": "npm:debug@2.2.0",
"isarray": "npm:isarray@0.0.1",
"json3": "npm:json3@3.3.2"
},
"npm:stream-browserify@1.0.0": {
"events": "github:jspm/nodelibs-events@0.1.1",
"inherits": "npm:inherits@2.0.1",
"readable-stream": "npm:readable-stream@1.1.14"
},
"npm:string_decoder@0.10.31": {
"buffer": "github:jspm/nodelibs-buffer@0.1.0"
},
"npm:url@0.10.3": {
"assert": "github:jspm/nodelibs-assert@0.1.0",
"punycode": "npm:punycode@1.3.2",
"querystring": "npm:querystring@0.2.0",
"util": "github:jspm/nodelibs-util@0.1.0"
},
"npm:utf8@2.1.0": {
"systemjs-json": "github:systemjs/plugin-json@0.1.2"
},
"npm:util@0.10.3": {
"inherits": "npm:inherits@2.0.1",
"process": "github:jspm/nodelibs-process@0.1.2"
},
"npm:vm-browserify@0.0.4": {
"indexof": "npm:indexof@0.0.1"
},
"npm:xmlhttprequest@1.8.0": {
"buffer": "github:jspm/nodelibs-buffer@0.1.0",
"child_process": "github:jspm/nodelibs-child_process@0.1.0",
"fs": "github:jspm/nodelibs-fs@0.1.2",
"http": "github:jspm/nodelibs-http@1.7.1",
"https": "github:jspm/nodelibs-https@0.1.0",
"process": "github:jspm/nodelibs-process@0.1.2",
"url": "github:jspm/nodelibs-url@0.1.0"
}
}
});
答案 0 :(得分:3)
这不是JSPM问题,但d3 API已更改。
还删除了format.parse方法,转而使用单独的d3.timeParse,d3.utcParse和d3.isoParse解析器构造函数。因此,这个代码在3.x:
var parseTime = d3.time.format("%c").parse;
可以在4.0中重写为:
var parseTime = d3.timeParse("%c");
https://github.com/d3/d3/blob/master/CHANGES.md#time-formats-d3-time-format
默认情况下,它会安装版本4.
import { timeFormat } from 'd3';
export class Welcome {
attached() {
var formatMonth = timeFormat("%B"),
formatDay = timeFormat("%A"),
date = new Date(2014, 4, 1);
console.log(formatMonth(date)); // "May"
console.log(formatDay(date)); // "Thursday"
}
}
作品