[Bug]: Error: Cannot find module 'common-tags'
rburgst opened this issue · comments
Summary
trying to build a gatsby-v5 site with node-18 fails with
9:09:04 AM: Error message
9:09:04 AM: Could not import plugin:
9:09:04 AM: Error: Cannot find module 'common-tags'
9:09:04 AM: Require stack:
9:09:04 AM: - /opt/build/repo/.netlify/plugins/node_modules/@netlify/plugin-gatsby/lib/index.js
9:09:04 AM:
9:09:04 AM: Plugin details
9:09:04 AM: Package: @netlify/plugin-gatsby
9:09:04 AM: Version: 3.4.8
9:09:04 AM: Repository: git+https://github.com/netlify/netlify-plugin-gatsby.git
9:09:04 AM: npm link: https://www.npmjs.com/package/@netlify/plugin-gatsby
9:09:04 AM: Report issues: https://github.com/netlify/netlify-plugin-gatsby/issues
9:09:04 AM:
9:09:04 AM: Error location
9:09:04 AM: While loading "@netlify/plugin-gatsby" from netlify.toml
9:09:04 AM: at Function.Module._resolveFilename (node:internal/modules/cjs/loader:985:15)
9:09:04 AM: at Function.Module._load (node:internal/modules/cjs/loader:833:27)
9:09:04 AM: at Module.require (node:internal/modules/cjs/loader:1057:19)
9:09:04 AM: at require (node:internal/modules/cjs/helpers:103:18)
9:09:04 AM: at Object.<anonymous> (/opt/build/repo/.netlify/plugins/node_modules/@netlify/plugin-gatsby/lib/index.js:10:23)
9:09:04 AM: at Module._compile (node:internal/modules/cjs/loader:1155:14)
9:09:04 AM: at Object.Module._extensions..js (node:internal/modules/cjs/loader:1209:10)
9:09:04 AM: at Module.load (node:internal/modules/cjs/loader:1033:32)
9:09:04 AM: at Function.Module._load (node:internal/modules/cjs/loader:868:12)
9:09:04 AM: at ModuleWrap.<anonymous> (node:internal/modules/esm/translators:169:29)
9:09:04 AM:
9:09:04 AM: Error properties
9:09:04 AM: { code: 'MODULE_NOT_FOUND' }
Note that I am using yarn2 with pnp.
Steps to reproduce
- create a gatsby v5 app
- add the following
netlify.toml
[[plugins]] package = "@netlify/plugin-gatsby"
- use
yarn berry
3.3.2
4
A link to a reproduction repository
No response
Plugin version
3.4.8
More information about your build
- I am building using the CLI
- I am building using file-based configuration (
netlify.toml
)
What OS are you using?
Mac OS
Your netlify.toml file
`netlify.toml`
[[plugins]]
package = "@netlify/plugin-gatsby"
Configuration
`gatsby-config.js` and options
module.exports = {
graphqlTypegen: true,
flags: {
FAST_DEV: true,
},
siteMetadata: {
navbarLinks: [
{ to: '/post', name: 'Blog' },
{ to: '/faq', name: 'FAQ' },
{ to: '/imprint', name: 'Imprint' },
{ to: '/privacy', name: 'Privacy' },
],
siteUrl: 'https://web.site',
title: 'Homepage',
description:
'Description.',
author: 'Me',
homepageHeader: 'Homepage',
homepageAbout:
'About',
github: 'https://github.com/rburgst',
facebook: 'https://www.facebook.com',
twitter: 'http://twitter.com/',
},
plugins: [
'gatsby-plugin-sitemap',
'gatsby-plugin-image',
'gatsby-plugin-sharp',
'gatsby-plugin-react-helmet',
'gatsby-transformer-sharp',
'gatsby-plugin-sass',
{
resolve: 'gatsby-source-filesystem',
options: {
name: 'images',
path: `${__dirname}/src/images`,
},
},
{
resolve: 'gatsby-source-filesystem',
options: {
path: `${__dirname}/content/`,
name: 'content',
},
},
{
resolve: 'gatsby-plugin-manifest',
options: {
name: 'gatsby-starter-default',
short_name: 'focusgtd',
start_url: '/',
background_color: '#663399',
theme_color: '#663399',
display: 'minimal-ui',
icon: 'src/images/focusgtd-icon.png', // This path is relative to the root of the site.
},
},
{
resolve: 'gatsby-transformer-remark',
options: {
plugins: [
'gatsby-remark-copy-linked-files',
'gatsby-remark-check-links',
{
resolve: 'gatsby-remark-images',
options: {
maxWidth: 600,
// fit: 'inside',
withWebp: true,
showCaptions: true,
},
},
{
resolve: 'gatsby-remark-prismjs',
options: {
classPrefix: 'language-',
inlineCodeMarker: null,
aliases: {},
showLineNumbers: true,
noInlineHighlight: false,
prompt: {
user: 'root',
host: 'localhost',
global: false,
},
},
},
],
},
},
{
resolve: 'gatsby-plugin-feed',
options: {
query: `
{
site {
siteMetadata {
title
description
siteUrl
site_url: siteUrl
}
}
}
`,
feeds: [
{
serialize: ({ query: { site, allMarkdownRemark } }) => {
return allMarkdownRemark.edges.map((edge) => {
return {
...edge.node.frontmatter,
description: edge.node.excerpt,
date: edge.node.frontmatter.date,
url: site.siteMetadata.siteUrl + edge.node.fields.slug,
guid: site.siteMetadata.siteUrl + edge.node.fields.slug,
custom_elements: [{ 'content:encoded': edge.node.html }],
}
})
},
query: `{
allMarkdownRemark(
limit: 1000
sort: {frontmatter: {date: DESC}}
filter: {fields: {type: {eq: "post"}}}
) {
edges {
node {
excerpt
html
fields {
slug
}
frontmatter {
title
date
}
}
}
}
}`,
output: '/post/index.xml',
title: 'RSS Feed',
},
],
},
},
],
}
Environment
Environment
# Paste output from `npx envinfo` here.
Gatsby info
gatsby info
yarn gatsby info
System:
OS: macOS 13.0.1
CPU: (8) arm64 Apple M1 Pro
Shell: 5.8.1 - /bin/zsh
Binaries:
Node: 18.12.1 - /private/var/folders/qm/2wy0hxgs30q25ws7qgql07600000gn/T/xfs-a3163e6e/node
Yarn: 3.3.0 - /private/var/folders/qm/2wy0hxgs30q25ws7qgql07600000gn/T/xfs-a3163e6e/yarn
npm: 8.19.2 - ~/.volta/tools/image/node/18.12.1/bin/npm
Browsers:
Firefox: 107.0
Safari: 16.1
Your _redirects file
`_redirects`
# Paste content of your `_redirects` file here
Builds logs (or link to your logs)
Build logs
9:09:04 AM: Error message
9:09:04 AM: Could not import plugin:
9:09:04 AM: Error: Cannot find module 'common-tags'
9:09:04 AM: Require stack:
9:09:04 AM: - /opt/build/repo/.netlify/plugins/node_modules/@netlify/plugin-gatsby/lib/index.js
9:09:04 AM:
9:09:04 AM: Plugin details
9:09:04 AM: Package: @netlify/plugin-gatsby
9:09:04 AM: Version: 3.4.8
9:09:04 AM: Repository: git+https://github.com/netlify/netlify-plugin-gatsby.git
9:09:04 AM: npm link: https://www.npmjs.com/package/@netlify/plugin-gatsby
9:09:04 AM: Report issues: https://github.com/netlify/netlify-plugin-gatsby/issues
9:09:04 AM:
9:09:04 AM: Error location
9:09:04 AM: While loading "@netlify/plugin-gatsby" from netlify.toml
9:09:04 AM: at Function.Module._resolveFilename (node:internal/modules/cjs/loader:985:15)
9:09:04 AM: at Function.Module._load (node:internal/modules/cjs/loader:833:27)
9:09:04 AM: at Module.require (node:internal/modules/cjs/loader:1057:19)
9:09:04 AM: at require (node:internal/modules/cjs/helpers:103:18)
9:09:04 AM: at Object.<anonymous> (/opt/build/repo/.netlify/plugins/node_modules/@netlify/plugin-gatsby/lib/index.js:10:23)
9:09:04 AM: at Module._compile (node:internal/modules/cjs/loader:1155:14)
9:09:04 AM: at Object.Module._extensions..js (node:internal/modules/cjs/loader:1209:10)
9:09:04 AM: at Module.load (node:internal/modules/cjs/loader:1033:32)
9:09:04 AM: at Function.Module._load (node:internal/modules/cjs/loader:868:12)
9:09:04 AM: at ModuleWrap.<anonymous> (node:internal/modules/esm/translators:169:29)
9:09:04 AM:
9:09:04 AM: Error properties
9:09:04 AM: { code: 'MODULE_NOT_FOUND' }
Function logs
Function logs
# Paste logs here
Hi @rburgst ,
Thanks for opening an issue. Since you're using pnpm
, you'll have to enable public hoisting
You can do this by creating (or updating if it already exists) an .npmrc file in the root of your project and add
public-hoist-pattern[]=*
Let us know if that resolves things for you and if not we'll take another look
Hi. Actually I am using yarn2 with plug and play (pnp)
now, I tried switching to pnpm and added the shamefully-hoist
option. Now I get this error:
7:43:33 AM: Verify run directory
7:43:35 AM:
7:43:35 AM: ────────────────────────────────────────────────────────────────
7:43:35 AM: Netlify Build
7:43:35 AM: ────────────────────────────────────────────────────────────────
7:43:35 AM:
7:43:35 AM: ❯ Version
7:43:35 AM: @netlify/build 29.0.1
7:43:35 AM:
7:43:35 AM: ❯ Flags
7:43:35 AM: baseRelDir: true
7:43:35 AM: buildId: 6392d8da0dc11e0008e443aa
7:43:35 AM: deployId: 6392d8da0dc11e0008e443ac
7:43:35 AM:
7:43:35 AM: ❯ Current directory
7:43:35 AM: /opt/build/repo
7:43:35 AM:
7:43:35 AM: ❯ Config file
7:43:35 AM: /opt/build/repo/netlify.toml
7:43:35 AM:
7:43:35 AM: ❯ Context
7:43:35 AM: production
7:43:35 AM:
7:43:35 AM: ❯ Installing plugins
7:43:35 AM: - netlify-plugin-gatsby-cache@0.3.0
7:43:35 AM:
7:43:35 AM: ❯ Loading plugins
7:43:35 AM: - netlify-plugin-gatsby-cache@0.3.0 from Netlify app
7:43:35 AM: - @netlify/plugin-gatsby@3.4.8 from netlify.toml and package.json
7:43:37 AM:
7:43:37 AM: ────────────────────────────────────────────────────────────────
7:43:37 AM: Plugin "@netlify/plugin-gatsby" internal error
7:43:37 AM: ────────────────────────────────────────────────────────────────
7:43:37 AM:
7:43:37 AM: Error message
7:43:37 AM: Could not import plugin:
7:43:37 AM: Error: Cannot find module '@gatsbyjs/reach-router/lib/utils'
7:43:37 AM: Require stack:
7:43:37 AM: - /opt/build/repo/node_modules/.pnpm/@netlify+plugin-gatsby@3.4.8_common-tags@1.8.2/node_modules/@netlify/plugin-gatsby/lib/templates/api/gatsbyFunction.js
7:43:37 AM: - /opt/build/repo/node_modules/.pnpm/@netlify+plugin-gatsby@3.4.8_common-tags@1.8.2/node_modules/@netlify/plugin-gatsby/lib/templates/handlers.js
7:43:37 AM: - /opt/build/repo/node_modules/.pnpm/@netlify+plugin-gatsby@3.4.8_common-tags@1.8.2/node_modules/@netlify/plugin-gatsby/lib/helpers/functions.js
7:43:37 AM: - /opt/build/repo/node_modules/.pnpm/@netlify+plugin-gatsby@3.4.8_common-tags@1.8.2/node_modules/@netlify/plugin-gatsby/lib/index.js
7:43:37 AM:
7:43:37 AM: Plugin details
7:43:37 AM: Package: @netlify/plugin-gatsby
7:43:37 AM: Version: 3.4.8
7:43:37 AM: Repository: git+https://github.com/netlify/netlify-plugin-gatsby.git
7:43:37 AM: npm link: https://www.npmjs.com/package/@netlify/plugin-gatsby
7:43:37 AM: Report issues: https://github.com/netlify/netlify-plugin-gatsby/issues
7:43:37 AM:
7:43:37 AM: Error location
7:43:37 AM: While loading "@netlify/plugin-gatsby" from netlify.toml and package.json
7:43:37 AM: at Module._resolveFilename (node:internal/modules/cjs/loader:995:15)
7:43:37 AM: at Module._load (node:internal/modules/cjs/loader:841:27)
7:43:37 AM: at Module.require (node:internal/modules/cjs/loader:1061:19)
7:43:37 AM: at require (node:internal/modules/cjs/helpers:103:18)
7:43:37 AM: at Object.<anonymous> (/opt/build/repo/node_modules/.pnpm/@netlify+plugin-gatsby@3.4.8_common-tags@1.8.2/node_modules/@netlify/plugin-gatsby/lib/templates/api/gatsbyFunction.js:10:17)
7:43:37 AM: at Module._compile (node:internal/modules/cjs/loader:1159:14)
7:43:37 AM: at Module._extensions..js (node:internal/modules/cjs/loader:1213:10)
7:43:37 AM: at Module.load (node:internal/modules/cjs/loader:1037:32)
7:43:37 AM: at Module._load (node:internal/modules/cjs/loader:878:12)
7:43:37 AM: at Module.require (node:internal/modules/cjs/loader:1061:19)
7:43:37 AM:
7:43:37 AM: Error properties
7:43:37 AM: { code: 'MODULE_NOT_FOUND' }
7:43:37 AM:
7:43:37 AM: Resolved config
7:43:37 AM: build:
7:43:37 AM: command: gatsby build
7:43:37 AM: commandOrigin: ui
7:43:37 AM: publish: /opt/build/repo/public
7:43:37 AM: publishOrigin: ui
7:43:37 AM: plugins:
7:43:37 AM: - inputs: {}
7:43:37 AM: origin: ui
7:43:37 AM: package: netlify-plugin-gatsby-cache
7:43:37 AM: - inputs: {}
7:43:37 AM: origin: config
7:43:37 AM: package: '@netlify/plugin-gatsby'
Note that this is a gatsby v5 project on pnpm 7.7.0 and node 18.
Note that I switched back to yarn berry and set the node version via .node-version
to 18. Now it works
Ah ok, sorry about the confusion on my end regarding the package manager - I thought it might've been a typo 😅
Thanks for trying pnpm
out though and letting us know the results and what ended up working for you. I'm pulling this issue into our team's backlog and we'll take a better look at this as soon as we can.
Hi @rburgst ,
Had a chat with the team and have some more info for you:
Netlify currently doesn't support yarn PnP when plugins are part of a site build (though we're looking into introducing full support) so we won't be looking into the original issue further and I'll be closing this Github issue.
(( This is my edit that I forgot to add in the original message - officially we recommend using the nodeLinker
, docs for this can be found here ))
Regarding the error with pnpm
- I'm not sure if this was included in your Gatsby project when you were testing it, but an additional plugin is needed for pnpm
support (which I didn't realize until recently).
Not sure if this was missing from the project that was leading to the pnpm
related error that you were seeing, but in case there's any future readers of the issue who run into something similar, it's worth looking into.