Bibberty
Bibberty

Reputation: 4768

Using import statement, why does it fail with "Uncaught SyntaxError: Unexpected identifier""

So I am trying to test out import myFunction from './mymodules.js'. Opening in Chrome and I get the error - Uncaught SyntaxError: Unexpected identifier

here is the Repl: https://repl.it/@PaulThomas1/ModulePractice

I am looking at this article : https://developers.google.com/web/fundamentals/primers/modules

My module class:

export default function findInArray(arr, search) {
  if(Array.isArray(arr) == false) return Error("arr - Is not an array");
  if(search == undefined) return Error("search - Undefined");

  let searchMethod;

  if(typeof search == 'string') {
      searchMethod = (element) => { 
        return search == element;
      };
    } else {
      searchMethod = (element) => {
        return search(element);
      };
    }

  arr.forEach(element => {
    if(searchMethod(element)) {
      return element;
    }
  });

  return '';
}

My Javascript that is trying to import this :

import findInArray from './modules/util.js';

let myArray = ["Bill", "Bob", "Ben"];

console.log(findInArray(myArray, "Bob"));

NOTE: In the Repl it recognizes the method from the import, but fails to run. I have read several gotcha pages, but nothing on this. Am I doing something obviously wrong?

Upvotes: 1

Views: 540

Answers (1)

Andy
Andy

Reputation: 63514

Looks like a couple of issues:

1) You only need to load in script.js since that calls in the other module (make sure type="module" is on that script tho)

<script type="module" src="script.js"></script>

2) In util you can't return from the callback of forEach like that. You should probably use either filter or find to return a new array or object instead depending on your requirements:

return arr.filter(element => searchMethod(element));

Upvotes: 2

Related Questions