Plusieurs instances de « Style Component » sont initialisées dans cette application
J'ai essayé toutes les solutions et j'en viens maintenant à cette question, je construis une bibliothèque de composants d'interface utilisateur.
J'ai deux packages, un pour la bibliothèque et un pour la démo, la démo utilise la bibliothèque à l'aide d'un lien symbolique, fichier : ../ui dans son package.json, je construis d'abord la bibliothèque puis je l'utilise dans le package de démonstration
Le code est disponible sur https://github.com/Qawaz/qal-ui/
J'essaie d'utiliser npm dedupe 删除重复依赖项，但没有成功。使用命令 npm ls styled-components J'obtiens
+-- @paljs/ui@1.1.1 -> .\..\ui | `-- styled-components@6.0.3 +-- babel-plugin-styled-components@2.1.4 | `-- styled-components@6.0.3 deduped +-- gatsby-plugin-styled-components@6.11.0 | `-- styled-components@6.0.3 deduped `-- styled-components@6.0.3
Auparavant, j'ai activé le module parent et l'espace de travail, et les deux packages utilisaient npm pour partager des dépendances, mais j'ai supprimé cela et je suis passé à des modules complètement séparés, mais un module avait des dépendances sur l'autre à l'aide de liens symboliques.
- styled-components est une dépendance homologue dans la bibliothèque de composants, pas une dépendance directe
- Les versions des composants de style des deux projets restent cohérentes
- Utiliser Gatsby, utiliser le plugin Babel pour les composants stylisés et le plugin Gatsby pour les composants stylisés
Ajoutez ceci à mon gatsby-node.js message (suggéré dans certaines réponses)
const path = require("path")
exports.onCreateWebpackConfig = ({stage, actions}) => {
actions.setWebpackConfig({
resolve: {
alias: {
"styled-components": path.resolve("node_modules", "styled-components"),
}
}
})
}
J'obtiens cette erreur dans la console, cette erreur est un faux positif, si vous changez quelque chose dans gatsby-config et au hasard ça disparaît
export 'createContentDigest' (imported as 'createContentDigest') was not found in 'gatsby-core-utils/create-content-digest' (module has no exports)
Certaines réponses l'indiquent également et cela a provoqué la rupture de mon build
optimization: {
runtimeChunk: {
name: "vendor"
}
}