Javascript react中的缩略图组件错误
我已将缩略图组件添加到我的项目中。添加后,我在项目中看到以下错误。错误显示在下图中 下面是我的webpack.config.js文件代码,它可能会帮助您理解这个问题。这里有一个要指定的加载程序。我不知道这个指定的加载程序是什么。有人面临同样的问题吗 关于这个问题有什么帮助吗Javascript react中的缩略图组件错误,javascript,react-native,webpack,react-component,webpack.config.js,Javascript,React Native,Webpack,React Component,Webpack.config.js,我已将缩略图组件添加到我的项目中。添加后,我在项目中看到以下错误。错误显示在下图中 下面是我的webpack.config.js文件代码,它可能会帮助您理解这个问题。这里有一个要指定的加载程序。我不知道这个指定的加载程序是什么。有人面临同样的问题吗 关于这个问题有什么帮助吗 **/*webpack.config.js*/** /* eslint comma-dangle: ["error", {"functions": "never", "arrays": "only-multiline
**/*webpack.config.js*/**
/* eslint comma-dangle: ["error",
{"functions": "never", "arrays": "only-multiline", "objects":
"only-multiline"} ] */
const webpack = require('webpack');
const pathLib = require('path');
const devBuild = process.env.NODE_ENV !== 'production';
const config = {
entry: [
'es5-shim/es5-shim',
'es5-shim/es5-sham',
'babel-polyfill',
'./app/bundles/HelloWorld/startup/registration',
],
output: {
filename: 'webpack-bundle.js',
path: pathLib.resolve(__dirname, '../app/assets/webpack'),
},
resolve: {
extensions: ['.js', '.jsx'],
},
plugins: [
new webpack.EnvironmentPlugin({ NODE_ENV: 'development' }),
],
module: {
rules: [
{
test: require.resolve('react'),
use: {
loader: 'imports-loader',
options: {
shim: 'es5-shim/es5-shim',
sham: 'es5-shim/es5-sham',
}
},
},
{
test: /\.jsx?$/,
use: 'babel-loader',
exclude: /node_modules/,
},
{
test: /\.css$/,
include: /node_modules/,
loaders: ['style-loader', 'css-loader'],
},
],
},
};
module.exports = config;
if (devBuild) {
console.log('Webpack dev build for Rails'); // eslint-disable-line no-console
module.exports.devtool = 'eval-source-map';
} else {
console.log('Webpack production build for Rails'); // eslint-disable-line no-console
}
下面是我调用组件的代码:
import React, { Component } from 'react';
import Thumbnail from 'react-native-thumbnail-video';
class VideoThumnail extends Component {
render() {
return(
<div>
<Thumbnail url="https://www.youtube.com/watch?v=lgj3D5-jJ74" />
</div>
);
}
}
export default VideoThumnail;
import React,{Component}来自'React';
从“反应本地缩略图视频”导入缩略图;
类VideoThumMail扩展了组件{
render(){
返回(
);
}
}
导出默认VideoThumnail;
如果您正在执行web应用程序,则不能使用为react native指定的库。这仅适用于react本地移动应用程序
如果您想为web应用程序使用这样的mudules,我想您可以尝试类似这样的方法,是的,但在将其添加到我的项目后出现错误-未捕获错误:addComponentAsRefTo(…):只有ReactOwner可以有引用。您可能正在向未在组件的
render
方法中创建的组件添加引用,或者已加载多个副本