1st attempt at SSG
I set target: 'static' in the config. When I run nuxt generate I get a bunch of errors like this one:
ERROR in ./node_modules/.cache/nuxt/router.js
Module not found: Error: Can't resolve './pages/Category.vue' in '/app/packages/theme/node_modules/.cache/nuxt'
@ ./node_modules/.cache/nuxt/router.js 167:24-169:3
@ ./node_modules/.cache/nuxt/index.js
@ ./node_modules/.cache/nuxt/client.js
@ multi ./node_modules/.cache/nuxt/composition-api/register.js ./node_modules/.cache/nuxt/client.js
Is there a way to turn on more verbose logging or other suggestions as to where I should start looking? Thanks
9 Replies
It seems like when build is running, it can't find this file.
Can you confirm you have this file?
I have this file under packages/theme/pages but not under packages/theme/node_modules/.cache/nuxt. None of the pages exist in that folder.
hm...did you run build command? Can you please also confirm what VSF version are you using?
Version 2.7.5.
I am trying to generate a static deploy by running yarn generate. Here's an exerpt from the root package.json:
"scripts": {
"build": "yarn build:api-client && yarn build:composables && yarn build:theme",
"generate": "yarn build:api-client && yarn build:composables && yarn generate:theme",
"build:api-client": "cd packages/api-client && yarn build",
"build:composables": "cd packages/composables && yarn build",
"build:theme": "cd packages/theme && yarn build",
"generate:theme": "cd packages/theme && yarn generate",
...and the package.json in the theme folder:
"scripts": {
"dev": "nuxt",
"build": "nuxt build -m",
"build:analyze": "nuxt build -a -m",
"start": "nuxt start",
"generate": "nuxt generate",
I'll look into it 🙂
Any thoughts?
Not giving up, someone must have tried SSG?
Some progress now gives me the following error when running the nuxt generate command:
Module not found: Error: Can't resolve '~/components/WishlistSidebar.vue' in '/app/packages/theme/_theme/layouts'
@ ./_theme/layouts/default.vue?vue&type=script&lang=js& (/app/node_modules/babel-loader/lib??ref--2-0!/app/node_modules/vue-loader/lib??vue-loader-options!/app/node_modules/unplugin/dist/webpack/loaders/transform.js??ref--14-0!./_theme/layouts/default.vue?vue&type=script&lang=js&) 34:0-63 50:21-36
@ ./_theme/layouts/default.vue?vue&type=script&lang=js&
@ ./_theme/layouts/default.vue
@ ./node_modules/.cache/nuxt/App.js
@ ./node_modules/.cache/nuxt/index.js
@ ./node_modules/.cache/nuxt/client.js
@ multi ./node_modules/.cache/nuxt/composition-api/register.js ./node_modules/.cache/nuxt/client.js
FATAL Nuxt build error
at WebpackBundler.webpackCompile (/app/node_modules/@nuxt/webpack/dist/webpack.js:2127:21)
at runMicrotasks (<anonymous>)
at processTicksAndRejections (internal/process/task_queues.js:95:5)
at async WebpackBundler.build (/app/node_modules/@nuxt/webpack/dist/webpack.js:2076:5)
at async Builder.build (/app/node_modules/@nuxt/builder/dist/builder.js:327:5)
at async ensureBuild (/app/node_modules/@nuxt/cli/dist/cli-generate.js:144:3)
at async Object.run (/app/node_modules/@nuxt/cli/dist/cli-generate.js:282:7)
at async NuxtCommand.run (/app/node_modules/@nuxt/cli/dist/cli-index.js:413:7)
It looks like the build module: @vue-storefront/nuxt-theme is defining these aliases:
this.extendBuild((config) => {
delete config.resolve.alias['~'];
config.resolve.alias['~/middleware'] = path.join(projectLocalThemeDir, path.sep + 'middleware');
config.resolve.alias['~/components'] = path.join(projectLocalThemeDir, path.sep + 'components');
config.resolve.alias['~/assets'] = path.join(projectLocalThemeDir, path.sep + 'assets');
config.resolve.alias['~'] = path.join(projectLocalThemeDir);
});
However the projectLocalThemeDir variable is set to: "/app/packages/theme/node_modules/.cache/nuxt"
Shouldn't it be set to: "/app/packages/theme"?
That's the parent directory where all the components reside.
Hm...that's interesting. Can you open up the issue about it https://github.com/vuestorefront/vue-storefront over here, our engineers will take a look
GitHub
GitHub - vuestorefront/vue-storefront: The open-source frontend for...
The open-source frontend for any eCommerce. Built with a PWA and headless approach, using a modern JS stack. We have custom integrations with Magento, commercetools, Shopware and Shopify and total ...
GitHub
Nuxt Generate failure due to invalid alias setting · Issue #6989 · ...
Environment OS: Windows-WSL2-Ubuntu 22.04 Node: 14.17 Docker Image: FROM mcr.microsoft.com/devcontainers/javascript-node:14 Project Version: V1.5.0 https://github.com/vuestorefront-community/spree ...
Looks like changing index.js in @vue-storefront/nuxt-theme fixes the issue:
// const projectLocalThemeDir = this.options.buildDir.replace('.nuxt', targetDirectory);
const path = require('path');
const projectLocalThemeDir = path.join(this.options.rootDir, path.sep + targetDirectory);