4

When adding an external JavaScript library to an Eclipse project should I be adding the .js file (d3.v2.js), or the tarballed master pulled from Github?

Google tells me to Google it. Subsequent Googles remind me of the need to Google it.


Directory tree:

.
 |-build
 |---classes
 |-src
 |-WebContent
 |---foo.html
 |---META-INF
 |---WEB-INF
 |-----lib
 |---d3
 |-----d3.v2.js

Relative path from foo.html to d3.v2.js should be: "../d3/d3.v2.js"

  • But, maybe it's not. I don't know.
  • Whenever I reference d3.v2.js from foo.html nothing happens. By nothing happens, I mean nothing visually appears in the browser which suggests that d3.js even exists.

To 'add' d3.v2.js to Eclipse I took the following steps:

  1. Foo -> New -> JavaScript Source File -> Advanced -> Link to File in Filesystem -> /home/tyler/workspace/foo/d3/d3.v2.js

  2. Tried 5 different paths. None of them worked (do you have to use relative, absolute?)

    • src="/home/tyler/workspace/Foo/d3/d3.v2.js"
    • src="../d3/d3.v2.js"
    • src="/Foo/d3/d3.v2.js"
    • src="d3.v2.js"
  3. So, I deleted the reference to d3.v2.js in Eclipse and attempted to add as a library.

  4. Foo -> JavaScript Resources -> Add JavaScript Library -> User Library - Configure User Libraries -> New -> "D3" -> Add .js file -> d3.v2.js (location: /home/tyler/workspace/Snotra/d3

  5. Tried a bunch of paths.

    • src="d3.v2.js"
    • src="../d3/d3.v2.js"
    • src="/Foo/d3/d3.v2.js"

      1. Rinse, repeat.

Any ideas? I know that this is really easy, but I just don't understand the fundamentals of adding JavaScript libraries to Eclipse.

foo.html

<!DOCTYPE HTML>
<html lang="en">
    <head>
        <meta http-equiv="content-type" content="text/html" charset="utf-8" />
            <title>Tyler J. Fisher</title>
            <link rel="stylesheet" href="master.css" />
        <script type="text/javascript" src="../d3/d3.v2.js"></script>
    </head>

    <body>
         <section id="foo_view">
            <script type="text/javascript">
                            document.write("test"); <!--Works-->
                var dataset[1,2,3,4,5];
                d3.select("body").selectAll("p") <!--Doesn't work-->
                    .data(dataset)
                    .enter()
                    .append("p")
                    .text("RABBLE");
        </script>
     </section>
    </body>
</html>

document.write("test"); works.

The d3.js code doesn't.

So (maybe):

  • The relative path must be off (or maybe I have to use absolute paths)
  • Tomcat6 isn't serving JavaScript properly (due to human error)
  • Eclipse isn't serving JavaScript properly (due to human error)

1 Answer 1

6

What Eclipse deploys to Tomcat is what is inside WebContent. If your JS files are not in WebContent, they won't be part of the deployed web app.

You need to understand that what Eclipse shows you is you development, source folders. What is deployed is not this folder, but a directory structure conforming the Java EE specs:

  • Everything in WebContent is part of the deployed archive
  • The Java source files are compiled and stored in the WEB-INF/classes of the deployed archive
  • The non-Java files under a source directory ar copied to the WEB-INF/classes of the deployed archive
  • All the other files are not part of the deployed archive.
Sign up to request clarification or add additional context in comments.

4 Comments

Moved d3 folder to WebContent. src="d3/d3.v2.js". When deploying via Tomcat, d3 still doesn't produce any form of output. When loading .HTML file from browser it works perfectly.
message: /Snotra/d3/d3.v2.js || description: The requested resource (/Snotra/d3/d3.v2.js) is not available. Tomcat6 is running.
Then either you have not put the file wher you said you put it, or you haven't redeployed the webapp.
I'm looking at it right now...d3.v2.js is in Foo/WebContent/d3/d3.js. I wouldn't lie to you about where I put a file in a directory...

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.