Here's the code that I'm trying to convert to SSG:
import { Loader } from "@googlemaps/js-api-loader";
When I'm importing from a CommonJS module, e.g. @googlemaps/js-api-loader I'm getting the following error:
[vite-ssg] An internal error occurred.
[vite-ssg] Please report an issue, if none already exists: https://github.com/antfu/vite-ssg/issues
file:///C:/Users/xxx/source/vue-ssg-test/.vite-ssg-temp/5fjfvv3vwz/main.mjs:5
import { Loader } from "@googlemaps/js-api-loader";
^^^^^^
SyntaxError: Named export 'Loader' not found. The requested module '@googlemaps/js-api-loader' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:
import pkg from '@googlemaps/js-api-loader';
const { Loader } = pkg;
at ModuleJob._instantiate (node:internal/modules/esm/module_job:132:21)
at async ModuleJob.run (node:internal/modules/esm/module_job:214:5)
at async ModuleLoader.import (node:internal/modules/esm/loader:329:24)
at async build (file:///C:/Users/xxx/source/vue-ssg-test/node_modules/vite-ssg/dist/node.mjs:1017:87)
at async Object.handler (file:///C:/Users/xxx/source/vue-ssg-test/node_modules/vite-ssg/dist/node/cli.mjs:34:5)
Node.js v21.1.0
If I switch my code as the example in the error shows:
import pkg from '@googlemaps/js-api-loader';
const { Loader } = pkg;
...then I'm getting a different error:
"default" is not exported by "node_modules/@googlemaps/js-api-loader/dist/index.esm.js", imported by "src/views/HomeView.vue?vue&type=script&setup=true&lang.ts".
file: C:/Users/xxx/source/vue-ssg-test/src/views/HomeView.vue?vue&type=script&setup=true&lang.ts:6:7
4: import TheWelcome from '../components/TheWelcome.vue'
5:
6: import pkg from '@googlemaps/js-api-loader';
^
7: import { onMounted } from 'vue'
[vite-ssg] An internal error occurred.
[vite-ssg] Please report an issue, if none already exists: https://github.com/antfu/vite-ssg/issues
file:///C:/Users/xxx/source/vue-ssg-test/node_modules/rollup/dist/es/shared/node-entry.js:2287
base = Object.assign(new Error(base.message), base);
^
Error [RollupError]: "default" is not exported by "node_modules/@googlemaps/js-api-loader/dist/index.esm.js", imported by "src/views/HomeView.vue?vue&type=script&setup=true&lang.ts".
at error (file:///C:/Users/xxx/source/vue-ssg-test/node_modules/rollup/dist/es/shared/node-entry.js:2287:30)
at Module.error (file:///C:/Users/xxx/source/vue-ssg-test/node_modules/rollup/dist/es/shared/node-entry.js:13745:16)
at Module.traceVariable (file:///C:/Users/xxx/source/vue-ssg-test/node_modules/rollup/dist/es/shared/node-entry.js:14175:29)
at ModuleScope.findVariable (file:///C:/Users/xxx/source/vue-ssg-test/node_modules/rollup/dist/es/shared/node-entry.js:12615:39)
at FunctionScope.findVariable (file:///C:/Users/xxx/source/vue-ssg-test/node_modules/rollup/dist/es/shared/node-entry.js:7124:38)
at ChildScope.findVariable (file:///C:/Users/xxx/source/vue-ssg-test/node_modules/rollup/dist/es/shared/node-entry.js:7124:38)
at Identifier.bind (file:///C:/Users/xxx/source/vue-ssg-test/node_modules/rollup/dist/es/shared/node-entry.js:8319:40)
at VariableDeclarator.bind (file:///C:/Users/xxx/source/vue-ssg-test/node_modules/rollup/dist/es/shared/node-entry.js:5892:23)
at VariableDeclaration.bind (file:///C:/Users/xxx/source/vue-ssg-test/node_modules/rollup/dist/es/shared/node-entry.js:5888:28)
at BlockStatement.bind (file:///C:/Users/xxx/source/vue-ssg-test/node_modules/rollup/dist/es/shared/node-entry.js:5888:28) {
binding: 'default',
code: 'MISSING_EXPORT',
exporter: 'C:/Users/xxx/source/vue-ssg-test/node_modules/@googlemaps/js-api-loader/dist/index.esm.js',
id: 'C:/Users/xxx/source/vue-ssg-test/src/views/HomeView.vue?vue&type=script&setup=true&lang.ts',
url: 'https://rollupjs.org/troubleshooting/#error-name-is-not-exported-by-module',
pos: 240,
loc: {
column: 7,
file: 'C:/Users/xxx/source/vue-ssg-test/src/views/HomeView.vue?vue&type=script&setup=true&lang.ts',
line: 6
},
Reproduction
Create a new project following npm create vue@latest, convert it to vue-ssg following README, add the import example that I pasted in the beginning.
Describe the bug
Here's the code that I'm trying to convert to SSG:
When I'm importing from a CommonJS module, e.g. @googlemaps/js-api-loader I'm getting the following error:
If I switch my code as the example in the error shows:
...then I'm getting a different error:
Reproduction
Create a new project following
npm create vue@latest
, convert it to vue-ssg following README, add the import example that I pasted in the beginning.System Info
Used Package Manager
npm
Validations