记react 插件使用webpack5打包的一些坑点


可能遇见的问题:

  • react-jsx-dev-runtime.development.js:117 Warning: React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
  • 参考: https://stackoverflow.com/questions/61706057/webpack-typscript-library-import-is-undefined-in-react-project 我这里用到的是webpack5.所以没法使用4的一些插件因为不支持,我只配置了
    libraryTarget: 'umd',
    globalObject: 'this',
    这两个属性,在output中, 另外又发现启动后会爆出 Minified React error #321 这个错误,这里是因为插件本身的react引用要使用外部的,不是插件自身的react引用,在webpack 配置如下:
    externals: {
      react: { commonjs: 'react', commonjs2: 'react', amd: 'react', root: 'React', }, 'react-dom': { commonjs: 'react-dom', commonjs2: 'react-dom', amd: 'react-dom', root: 'ReactDOM', }, },
    此外可以在 package.json 中为 react 和 react-dom 添加同伴依赖 peerDependencies 的映射,这是为了检测宿主环境中这两项依赖的版本如果低于你规定的最低版本,那么在 npm@3 中会给出警告(npm@1 和 npm@2 中会自动安装)。 参考: https://zhuanlan.zhihu.com/p/93773786

   此外,gitingore中忽略的文件可能导致npm  publish 比如dist文件夹等的时候也忽略掉,所以如果你的文件需要发布到npm 的时候请不要写到gitinonre中

npm:

https://www.npmjs.com/package/llc-calendar

git:

https://github.com/luochenLing/llc-calendar


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM