How to fix "unexpected syntax error: unexpected token export" occurring when I'm trying to add a JS file that consists of an export command in the clientlibs? | Community
Skip to main content
S
Sijith
New Participant
October 14, 2022
Solved

How to fix "unexpected syntax error: unexpected token export" occurring when I'm trying to add a JS file that consists of an export command in the clientlibs?

  • October 14, 2022
  • 2 replies
  • 4495 views

I am trying to add a JS file into my component's clientlibs folder. That file contains an export command which is causing an error when I am opening a page saying: "Unexpected syntax error: Unexpected token export". I searched and found a solution to add type="module" to the script tag, but since I am including the file through data-sly-call in customfooterlibs, I'm not sure what to do. The export command is "export default Product" where Product is a class. How do I solve this issue?

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by malay_dube

Hi @sijith ,

Steps to be followed.
1) Remove all the logic inside the JS, just add one console or alert statement and see it's appearing or not.
2) If yes, add all of your logic inside JS and check page console.
3) If No, add those tags in page rendering component. 

2 replies

Aditya_Chabuku
Aditya_Chabuku
New Participant
October 14, 2022

Hi @sijith ,

 Did you try to include this tag in Page Rendering Component.? can you include that and see what's happening.

Thanks,Aditya Chabuku
    M
    malay_dube
    Employee
    October 14, 2022

    Hi @sijith ,
    It happens for 2 main reasons. please find below.

    1. Using the ES6 Module syntax in a Node.js application without  type  to module in package.json.
    2. Using the ES6 Module syntax in a script without setting type to module in the script tag.

    You need to include the file with a type attribute set to "module":

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

    then it should work as expected and you are ready to import your module in another module:


    import { foo, bar } from "./module.js";

    console.log( foo() );
    console.log( bar );



      S
      SijithAuthor
      New Participant
      October 14, 2022

      Thanks @malay_dube  for the reply! But the thing is I am not using node.js at all but  including the file through clientlibs using:

      <sly data-sly-use.clientlib="/libs/granite/sightly/templates/clientlib.html">
      <sly data-sly-call="${clientlib.js @ categories='my-categories.base'}"/>
      </sly>

      My JS file is in situated in the clientlibs folder with the category "my-categories.base". So even a script tag is not being used to include the JS.

       

        M
        malay_dubeAccepted solution
        Employee
        October 17, 2022

        Hi @sijith ,

        Steps to be followed.
        1) Remove all the logic inside the JS, just add one console or alert statement and see it's appearing or not.
        2) If yes, add all of your logic inside JS and check page console.
        3) If No, add those tags in page rendering component. 

          Terms & ConditionsAccessibility statement

          Loading footer...