ERROR Unexpected token 'export'

[qiulang]

I used bellhop in my nuxt v2 project, import with es6 module import { Bellhop } from 'bellhop-iframe'

But I hit the error SyntaxError: Unexpected token 'export'

12-27 15:52:37:   SyntaxError: Unexpected token 'export'
12-27 15:52:37:   at internalCompileFunction (node:internal/vm:73:18)
12-27 15:52:37:   at wrapSafe (node:internal/modules/cjs/loader:1178:20)
12-27 15:52:37:   at Module._compile (node:internal/modules/cjs/loader:1220:27)
12-27 15:52:37:   at Module._extensions..js (node:internal/modules/cjs/loader:13
12-27 15:52:37:   at Module.load (node:internal/modules/cjs/loader:1119:32)
12-27 15:52:37:   at Module._load (node:internal/modules/cjs/loader:960:12)
12-27 15:52:37:   at Module.require (node:internal/modules/cjs/loader:1143:19)
12-27 15:52:37:   at Hook._require.Module.require (/usr/local/lib/node_modules/p
12-27 15:52:37:   at require (node:internal/modules/cjs/helpers:119:18)
12-27 15:52:37:   at node_modules/vue-server-renderer/build.prod.js:1:76653
12-27 15:52:37:   at Object.<anonymous> (webpack:/external "bellhop-iframe":1:0)
12-27 15:52:37:   at __webpack_require__ (webpack/bootstrap:25:0)
12-27 15:52:37:   at Module.<anonymous> (server.js:72187:32)
12-27 15:52:37:   at __webpack_require__ (webpack/bootstrap:25:0)
12-27 15:52:37:   at Object.<anonymous> (server.js:50352:18)
12-27 15:52:37:   at __webpack_require__ (webpack/bootstrap:25:0)

In my project import other all modules using es6 , e.g

import * as dayjs from 'dayjs'
import Element from 'element-ui'

So I assume there must some setting related to module that causes this error. I tried to tinker with nuxt.config.js, e.g. transpile bellhop but I failed.

[qiulang]

I figure it out. Because this is a client side code, I need to set that in nuxt.config.js like this

plugins: [
        { src: '@/plugins/use-bellhop.js', mode: 'client'},
        ...
    ],

But the error only happens when I run my nuxt app in my docker. if I run my nuxt app in host directly I won't have this error. I have not figured that why.

[qiulang]

I have not figured out why I did not get this error if I run my nuxt app in host directly. Now I understand why that happens I think it should happen when I run my nuxt app in host directly.

BTW, expect for setting mode: 'client', I can also use umd code as import { Bellhop } from 'bellhop-iframe/dist/bellhop-umd.js'; But readme said import 'bellhop-iframe/dist/bellhop-umd.js'; that seems to a mistake.

[TensAndTwenties]

Hello @qiulang! I believe you're right about the import statement for .js on the Readme - that will be updated in the next version of Bellhop.

I'm glad you were able to work out the reference in the nuxt config file! It sounds like the error you're seeing only occurs in the Docker environment. The next obvious place to look is at the differences between the docker and host environments. The first thing that comes to mind is their respective versions of Node.js. Can you verify they're on the same version? Any other differences in environment that you may have set up inside your Docker instance?