Question

我正在尝试从我的nextjs-generic-landing-page中制作一个易于使用的NPM软件包，现在NPM位于https://www.npmjs.com/package/nextjs-generic-landing-page

由于某些原因，使用styled-jsx的组件无法正常工作，它们渲染异常并发出警告：

index.js:1 Warning: Received `true` for a non-boolean attribute `jsx`.

If you want to write it to the DOM, pass a string instead: jsx="true" or jsx={value.toString()}.
  in style
  in div
  in SocialSharing (at pages/index.js:32)
  …

以下是我使用Babel构建NPM软件包的代码：

"publish:npm": "rm -rf dist && for folder in {components,lib,config,public}; do mkdir -p dist/${folder} && babel ${folder} -d dist/${folder} --copy-files --presets=@babel/preset-env,next; done && cp package.json dist/"

有什么提示吗？

Answer 1

我缺少styled-jsx/babel插件：

"publish:npm": "rm -rf dist && for folder in {components,lib,config,public}; do mkdir -p dist/${folder} && babel ${folder} -d dist/${folder} --copy-files --presets=@babel/preset-env,next --plugins=styled-jsx/babel; done && cp package.json dist/"

在已发布的NPM包中使用styled-jsx会给出警告：非布尔属性jsx收到true。

1 个答案: