Как использовать веб-пакет в горячем режиме
Я использую в своем проекте реакции библиотеку, которую нужно скомпилировать с помощью веб-пакета (библиотека под названием storm-Reaction-Diagrams)
проблема заключается в том, что всякий раз, когда я делаю некоторые изменения в библиотеке, мне нужно скомпилировать ее с помощью веб-пакета, а затем перезапустить приложение реагирования с помощью запуска npm, чтобы изменения вступили в силу (сгенерированный bundle.js не обновляется до тех пор, пока я используйте npm start) .
Как я могу изменить это и просто автоматически обновлять страницу всякий раз, когда я редактирую приложение или библиотеку
для информации:
Я использую код VS
при изменении и сохранении файла в моем приложении реакции, страница в браузере перезагружается, и изменения вступают в силу без проблем. к сожалению, это не происходит, когда я изменяю файл в папке node_modules
файл конфигурации webpack
const webpack = require("webpack");
const UglifyJsPlugin = require("uglifyjs-webpack-plugin");
var path = require("path");
var plugins = [];
const production = process.env.NODE_ENV === "production";
//do we minify it all
if (production) {
console.log("creating production build");
plugins.push(
new webpack.DefinePlugin({
"process.env.NODE_ENV": '"development"'
})
);
}
/**
* @author Dylan Vorster
*/
module.exports =
//for building the umd distribution
{
entry: "./src/main.ts",
output: {
filename: "main.js",
path: __dirname + "/dist",
libraryTarget: "umd",
library: "storm-react-diagrams"
},
externals: {
react: {
root: "React",
commonjs2: "react",
commonjs: "react",
amd: "react"
},
"react-dom": {
root: "ReactDOM",
commonjs2: "react-dom",
commonjs: "react-dom",
amd: "react-dom"
},
lodash: {
commonjs: "lodash",
commonjs2: "lodash",
amd: "_",
root: "_"
}
},
plugins: plugins,
module: {
rules: [
{
enforce: "pre",
test: /\.js$/,
loader: "source-map-loader"
},
{
test: /\.tsx?$/,
loader: "ts-loader"
}
]
},
resolve: {
extensions: [".tsx", ".ts", ".js"]
},
devtool: production ? "source-map" : "cheap-module-source-map",
};