ofrohn / d3-celestial

A star map with d3.js
BSD 3-Clause "New" or "Revised" License
636 stars 181 forks source link

Problem with dependency d3 #30

Closed Astro-Otter-Space closed 5 years ago

Astro-Otter-Space commented 5 years ago

Hello,

I would like to use your library from NPM, but when i'm cmpiling with webpack.encore (because i'm working on symfony 4 project), i have this error :

Running webpack ...
 ERROR  Failed to compile with 1 errors                                                         14:50:55
This dependency was not found:
* d3 in ./assets/js/deepskymap.js

My script deepskymap.js is like this (it's a resume) :

import Celestial from 'd3-celestial';

export default function skymap()
{
  let config = {...};
  Celestial.add({...});
  Celestial.display(config);
}

And app.js :

import skymap from './deepskymap'
skymap();

Do i need to install/import d3 package NPM too ? Is something wrong ? Thank you :)

typpo commented 5 years ago

I'm not the maintainer but am working with this library. The project does require an external d3 dependency.

Astro-Otter-Space commented 5 years ago

Okay, ill try adding like this :

import * as d3 from './path/to/node_modules/d3-celestial/lib/d3.min.js'
import Celestial from 'd3-celestial';

export default function skymap()
{
  let config = {...};
  Celestial.add({...});
  Celestial.display(config);
}

all methods from Celestial are not recognized : deepskymap.js:142 Uncaught TypeError: d3_celestial__WEBPACK_IMPORTED_MODULE_1___default.a.display is not a function

Line 142 is Celestial.display(config);

Astro-Otter-Space commented 5 years ago

Here's a codesandbox : https://codesandbox.io/s/2w3267r59y

ofrohn commented 5 years ago

Sorry for the late comment, I was terribly busy for the last few months. I have now exported the entire Celestial object in case it was invoked via require. I think that may be what you wanted.

Astro-Otter-Space commented 5 years ago

Hello, don't worry for that :). I've seen your update is on 0.6.10 version and i use the version in NPM who is on 0.6.7. Could you update your npm package with last version please :) ?

www-data@php:~/deep-space-objects$ npm update -g d3-celestial
www-data@php:~/deep-space-objects$ yarn install
yarn install v1.13.0
[1/4] Resolving packages...
Couldn't find any versions for "d3-celestial" that matches "^0.6.10"
? Please choose a version of "d3-celestial" from this list: 0.6.7

After that, i will retest (and hope close the issue ^^)

ofrohn commented 5 years ago

Ah, so that doesn't work automatically. Oops. Updated

Astro-Otter-Space commented 5 years ago

Thank you for update but i still have problem. Maybe i don't do the right way. When i do : import Celestial from 'd3-celestial'
it doesn't work and i have this message "Could not find module in path: 'd3-celestial'".

So i do : import Celestial from 'd3-celestial/celestial'; Celestial is found (yeah) but now i have this message : "d3 is not defined". And if i import before like this :

import d3 from "d3";
import Celestial from 'd3-celestial/celestial';

Nothing change, same error message. So how can i inject d3 and run correctly ?

Astro-Otter-Space commented 5 years ago

EDIT : Following Module Pattern syntax, i succeeded to do like that :

import * as d3 from './../../node_modules/d3-celestial/lib/d3.min.js'
import geo from './../../node_modules/d3-celestial/lib/d3.geo.projection.min';

import Celestial from 'd3-celestial/celestial';

var mapModule = (function(c) {
    // build map
})(Celestial);

But i don't like this way. I'm looking for a better way using my script as component.

ofrohn commented 5 years ago

Agreed, that is hideous. I think I have to expose the d3 files in lib as modules as well, so I can just drop those damn dependencies anyway. I haven't had time to really test it, but it should now work like you did with Celestial as in

import d3 from 'd3-celestial/d3'

Coming soon: concat d3.geo.projection to d3...

Astro-Otter-Space commented 5 years ago

All right, i will test with your soluce (my way is working) however i think we can close this issue and i will waiting for an update of your NPM package :)