記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