我已经使用web-pack捆绑了我的react组件,以下是我用来完成相同任务的webpack.config.js文件
var path = require("path");
var HtmlWebpackPlugin = require("html-webpack-plugin");
module.exports = {
entry: "./src/index.js",
output: {
path: path.resolve(__dirname, "webpack"),
filename: "index_bundle.js",
libraryTarget: "umd",
library: "Lib",
umdNamedDefine: true,
globalObject: `(typeof self !== 'undefined' ? self : this)`
},
module: {
rules: [
{ test: /\.(js)$/, use: "babel-loader" },
{ test: /\.css$/, use: ["style-loader", "css-loader"] }
]
},
target: "web",
mode: "production",
plugins: [
new HtmlWebpackPlugin({
template: "./src/index.html"
})
]
};
我想在另一个React项目中使用它
我可以通过仅在本地复制inde_bundle.js文件并将其导入来完成此任务。但是现在我想从url加载文件,而我正在使用scriptjs
var scriptjs = require("scriptjs");
scriptjs.get(
"https://s3.ap-south-1.amazonaws.com/hardik97122/index_bundle.js",
function() {
console.log(Lib);
ReactDOM.render(<Lib />, document.getElementById("root"));
// return <lib />;
}
);
它不符合我的目的
应该从该URL呈现输出。也许我需要对Web Pack的配置进行一些更改,但是我不知道该怎么办。