Search code examples
javascriptnode.jsreactjspugparcel

Pug template loading error '<' unexpected token

I'm trying to load a React-jsx file using my PUG template. But I'm getting

 Unexpected token '<'

when I look into the browser console. Here is my code. I'm using Parcel.

doctype html
head
  meta(charset='UTF-8')
  title Pearson Launch
  base(href='/launch-ui')
  meta(name='viewport' content='width=device-width, initial-scale=1, shrink-to-fit=no')
  link(rel='shortcut icon' href='./lib/favicon.ico')
script(type='application/javascript' src='jsx/main.jsx')

Im new to Pug Template related development. Can you please explain is this not possible?

Solution

  • Here the issue was incorrect file path. I just created a virtual path as follow.

    app.use('/javascripts', express.static(path.join(__dirname, 'public')));

    And in my pug template, I just used script tag this way.

    script( src='javascripts/jsx/main.jsx')

    Now my file is properly loading. Since pug is a server-side rendering I can expect it the way it behaves in the browser. But there is another issue which is,

    SyntaxError: Cannot use import statement outside a module

    I will look into this and I think this is the answer to this issue.