我創(chuàng)建了一個(gè)簡(jiǎn)單的 React Lib,用于componentDidMount將外部腳本注入 dom,如下所示:import { Component } from "react"class Embed extends Component { componentDidMount () { const script = document.createElement("script") script.async = true script.src = "https://cdn.mysite.com/embed.js" document.head.appendChild(script); } render() { return null }}export default Embed這個(gè)文件在src/components/Embed.js然后在src/index.js我有:import Embed from './components/Embed'export default Embed我的package.json樣子是這樣的:{ "name": "my-embed-js", "version": "1.3.0", "description": "A react wrapper for my embed script", "main": "dist/index.cjs.js", "module": "dist/index.esm.js", "browser": "dist/index.js", "files": [ "dist" ], "scripts": { "build": "rollup -c", "dev": "rollup -c -w", "test": "echo \"Error: no test specified\" && exit 1", "prepublish": "rm -rf ./dist && npm run build" }, "keywords": [], "author": "Me", "license": "MIT", "devDependencies": { "@babel/core": "^7.9.0", "@babel/preset-env": "^7.9.0", "@babel/preset-react": "^7.9.0", "@rollup/plugin-commonjs": "^11.0.2", "@rollup/plugin-node-resolve": "^7.1.1", "react": "^16.13.1", "react-dom": "^16.13.1", "rollup": "^2.3.2", "rollup-plugin-babel": "^4.4.0", "rollup-plugin-peer-deps-external": "^2.2.2" }, "peerDependencies": { "react": "^16.13.1", "react-dom": "^16.13.1" }}我.babelrc的很簡(jiǎn)單:{ "presets": [ "@babel/env", "@babel/react" ]}在我的rollup.config.js文件中:import peerDepsExternal from 'rollup-plugin-peer-deps-external'import babel from 'rollup-plugin-babel'import resolve from '@rollup/plugin-node-resolve'import commonjs from '@rollup/plugin-commonjs'import pkg from './package.json'const INPUT_FILE_PATH = 'src/index.js';const OUTPUT_NAME = 'MyEmbedJs';這里發(fā)生了什么?除了我只是把我?guī)胨篮?linter 東西之外,我沒有看到任何有用的錯(cuò)誤消息。有什么想法嗎?
使用我在 Gatsby 網(wǎng)站上使用 Babel 和 Rollup 創(chuàng)建的 ES6 React Lib
胡子哥哥
2022-06-09 10:26:12