我想在我的应用程序中使用react-force-graph，但出现错误 Typec：Type.interrupt不是函数。错误来自zoom.js，它是react-forrce-graph包的依赖项。
我发现可以通过将d3选择包从1.3.2版降级到1.3.0版来解决该问题。怎么做？我可以通过更改react-force-graph程序包中package.json中的版本依赖性来编码，更新程序包后，更改将丢失。
我还发现，问题可能是由webpack设置引起的，但我只知道...
我发现，在不同的包装中存在类似的问题，他们通过降低d3包装的版本并通过纱线而不是npm进行加载来解决了此问题。
这很奇怪，因为他们的演示正常运行，所以我的webpack设置有问题吗？还是npm有什么问题？
从控制台完成错误：
*Uncaught TypeError: selection.interrupt is not a function
at Function../node_modules/force-graph/node_modules/d3-
zoom/src/zoom.js.webpack_exports.default.zoom.transform (zoom.js:90)
at Function../node_modules/force-graph/node_modules/d3-
zoom/src/zoom.js.webpack_exports.default.zoom.translateBy (zoom.js:119)
at adjustCanvasSize (force-graph.module.js:605)
at Function.init (force-graph.module.js:852)
at u (kapsule.min.js:1)
at Object.r [as comp] (kapsule.min.js:1)
at FromKapsuleComp.componentDidMount (react-kapsule.module.js:85)
at commitLifeCycles (react-dom.development.js:14685)
at commitAllLifeCycles (react-dom.development.js:15905)
at HTMLUnknownElement.callCallback (react-dom.development.js:145)*
webpack.conf.dev.js
const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const FaviconsWebpackPlugin = require('favicons-webpack-plugin');
module.exports = {
mode : 'development',
devtool: 'inline-source-map',
entry: {
app: ['./src/index', 'webpack-hot-middleware/client?reload=true']
},
output: {
path: path.join(__dirname, 'dist'),
filename: 'bundle.js',
publicPath: '/'
},
devServer: {
inline: true,
historyApiFallback: true
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
//new webpack.NoEmitOnErrorsPlugin(),
new HtmlWebpackPlugin({
template: './index.html',
filename: 'index.html',
inject: 'body',
title: 'Hot Module Reload'
}),
new webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify('development')
}),
new FaviconsWebpackPlugin({
// Your source logo
logo: './src/img/ikona.png',
// The prefix for all image files (might be a folder or a name)
prefix: 'favicon-[hash]/',
// Emit all stats of the generated icons
emitStats: false,
// don't rebuild the favicons until those hashes change
persistentCache: true,
// Inject the html into the html-webpack-plugin
inject: true,
// favicon background color (see https://github.com/haydenbleasel/favicons#usage)
background: '#EE3C96',
// favicon app title (see https://github.com/haydenbleasel/favicons#usage)
//title: 'Bonobox',
// which icons should be generated (see https://github.com/haydenbleasel/favicons#usage)
icons: {
android: false,
appleIcon: false,
appleStartup: false,
coast: false,
favicons: true,
firefox: false,
opengraph: false,
twitter: false,
yandex: false,
windows: false
}
})
],
module: {
rules: [
{
test: /\.js$/,
loaders: ['babel-loader'],
include: path.join(__dirname, 'src')
},
{
test: /\.html$/,
loaders: ['html-loader'],
},
{
test: /\.scss$/,
use: [
{loader: "style-loader"},
{loader: "css-loader"},
{loader: "sass-loader"}
]
},
{
test: /\.less$/,
use: [
{loader: "style-loader"},
{loader: "css-loader"},
{loader: "less-loader"}
]
},
{
test: /\.css$/,
use: [
{loader: "style-loader"},
{loader: "css-loader"}
]
},
{
test: /\.json$/,
loader: 'json-loader'
},
{test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: 'file-loader?mimetype=image/svg+xml'},
{test: /\.woff(\?v=\d+\.\d+\.\d+)?$/, loader: "file-loader?mimetype=application/font-woff"},
{test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/, loader: "file-loader?mimetype=application/font-woff"},
{test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: "file-loader?mimetype=application/octet-stream"},
{test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: "file-loader"},
{test: /\.(png|jpg|gif|mp4)$/, loader: 'file-loader?limit=8192'}
]
}
};
npm版本：最新-昨天已更新（更新前后均出错）
编辑：毛线-同样的问题