Exporting method from another JS file

Question

I cannot import method from another JavaScript file.

I try both exporting single method or class from the file but still does not work. Basically i'm trying to learn Mocha so i try to create library so i can test the methods in Mocha but my exporting and importing dont seem to work. I run the script in Chrome browser.

file: myTest.js

function myTestClass(){
    this.myTestText = "Welcome to myTestClass!";

    this.mySum = function(a, b) {
      return a + b;
    }

    this.mySubtraction = function(a,b) {
      return a - b;
    }

    this.myMultiply = function(a, b) {
      return a * b;
    }
};

export default {myTestClass};

file: test.js

import myTestClass from 'myTest.js';
console.log("enter test.js file");
console.log("test.js finished importing myTest.js file");

file: index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset=utf-8">
    <title>Mocha Tests</title>

    <link href="https://cdn.rawgit.com/mochajs/mocha/2.2.5/mocha.css" rel="stylesheet" />   

  </head>
  <body>
    <div id="mocha"></id>
    <div id="messages"></div>

<script src="https://cdn.rawgit.com/mochajs/mocha/2.2.5/mocha.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/chai/4.2.0/chai.js"></script>   
    <script type="module" class="mocha-init">
        mocha.setup('bdd');
    </script>

    <script src="test.js"></script>
    <script type="module"> 
        mocha.run();
    </script>

  </body>
</html>

when I open index.html in Chorme, none of my window.alert() functions get called so from that, the error must have occurred. Please note that all of my files are in the same directory.

Please can you clarify what you mean when you say "not of my window.alert() functions get called so from that"? — Joss Classey, Sep 17 '19 at 22:40
Side comment: please never use `alert` again. Use `console.log`, which can show you the _actual_ thing you're trying to gain insight into, instead of a forced string coercion that hides almost everything about what you're trying to debug. Also note that `import` _has_ to be at the top of the file. you cannot put anything above `import`: doing so makes the browser reject that code as bad JS, and will not run it. — Mike 'Pomax' Kamermans, Sep 17 '19 at 22:43
@JossClassey i use window.alert() calls to check of where the execution has stopped. So it stops at the import call. If i comment out the import call in test.js file, then all of my window.alert() calls are invoked. — Phil, Sep 17 '19 at 22:48
@Mike'Pomax'Kamermans thanks. I will use console.log instead and move import call to the top of the file. — Phil, Sep 17 '19 at 22:51

score 2 · Answer 1 · answered Sep 17 '19 at 23:07

2

You need to use relative referencing which starts with either "/", "./", or "../"

test.js

import myTestClass from './myTest.js';

answered Sep 17 '19 at 23:07

Nidhin Joseph

9,981
4
26
48

thanks, I update the path but still does not work. Please refer to my comment below responding to Matt Aft. – Phil Sep 18 '19 at 06:25

score 0 · Answer 2 · answered Sep 17 '19 at 23:12

0

This also depends if you're importing/exporting on the frontend or in Node. From what I remember, Node doesn't have import/export available so you would need to module.exports/require.

Export:

function myTestClass(){
    this.myTestText = "Welcome to myTestClass!";

    this.mySum = function(a, b) {
      return a + b;
    }

    this.mySubtraction = function(a,b) {
      return a - b;
    }

    this.myMultiply = function(a, b) {
      return a * b;
    }
};

export default myTestClass;

Import:

import myTestClass from './myTest.js'; // path to file that contains myTestClass

console.log("enter test.js file");
console.log("test.js finished importing myTest.js file");

answered Sep 17 '19 at 23:12

Matt Aft

8,742
3
24
37

I change to use your script and running the script inside Chrome browser but still does not work. So I start Chrome console by pressing Ctrl + Shift + J then I'm getting error saying "Cannot use import statement outside a module." So i change the script to your suggestion to use "module.exports" then use "require()" however I'm getting different error saying that "require()" is undefined. Google search suggested that i can reference "require.js" file, but haven't tried that yet. – Phil Sep 18 '19 at 06:24
@Phil take a look at this https://stackoverflow.com/questions/49718855/import-not-working-in-chrome – Matt Aft Sep 18 '19 at 06:56

Exporting method from another JS file

2 Answers2