আনকড রেফারেন্স এরিয়ার: প্রতিক্রিয়া সংজ্ঞায়িত করা হয় নি

Question 1

আমি এই টিউটোরিয়ালটি ব্যবহার করে রেলপথের সাথে বিক্রিয়া জেএসকে কাজ করার চেষ্টা করছি । আমি এই ত্রুটি পাচ্ছি:

Uncaught ReferenceError: React is not defined

কিন্তু আমি ব্রাউজার কনসোলে বস্তুর প্রতিক্রিয়া অ্যাক্সেস করতে পারেন আমি আরও যোগ করেছেন সর্বজনীন / Dist / Turbo-react.min.js হিসাবে বর্ণনা এখানে আরও বলেন বর্ণনা অনুযায়ী application.js লাইন এই উত্তরে কোন ভাগ্য হয়। অতিরিক্ত হিসাবে, ত্রুটি দেয়:
//= require components
var React = require('react')
Uncaught ReferenceError: require is not defined

এটি সমাধান করার উপায় সম্পর্কে কী কেউ আমাকে পরামর্শ দিতে পারেন?

[সম্পাদনা 1]
রেফারেন্সের জন্য উত্স কোড:
এটি আমার comments.js.jsxফাইল:

var Comment = React.createClass({
  render: function () {
    return (
      <div className="comment">
        <h2 className="commentAuthor">
          {this.props.author}
        </h2>
          {this.props.comment}
      </div>
      );
  }
});

var ready = function () {
  React.renderComponent(
    <Comment author="Richard" comment="This is a comment "/>,
    document.getElementById('comments')
  );
};

$(document).ready(ready);

এবং এটি আমার index.html.erb:

<div id="comments"></div>

Question 2

আমি নিম্নলিখিতটি আমার জাভাস্ক্রিপ্টটি তৈরি করতে আমার ওয়েবপ্যাকটি ব্যবহার করার সময় আমার এই ত্রুটিটি পুনরুত্পাদন করতে সক্ষম হয়েছিল webpack.config.json:

externals: {
    'react': 'React'
},

এই উপরের কনফিগারেশনটি ওয়েবপ্যাককে require('react')একটি এনপিএম মডিউল লোড করে সমাধান না করার জন্য বলেছে , পরিবর্তে বিশ্বব্যাপী ভেরিয়েবল (অর্থাত্‍ windowবস্তুতে) কল করা আশা করে React। সমাধানটি হয় হয় এই কনফিগারেশনের টুকরোটি সরিয়ে ফেলা (সুতরাং প্রতিক্রিয়াটি আপনার জাভাস্ক্রিপ্টের সাহায্যে বান্ডিল হবে) বা এই ফাইলটি কার্যকর হওয়ার আগে বাইরের প্রতিক্রিয়া কাঠামো লোড করুন (যাতে এটি window.Reactবিদ্যমান)।

Question 3

আমি এই ত্রুটিটি পেয়েছি কারণ আমি ব্যবহার করছি

import ReactDOM from 'react-dom'

প্রতিক্রিয়া আমদানি না করে, একবার আমি এটি নীচে পরিবর্তন করেছি:

import React from 'react';
import ReactDOM from 'react-dom';

ত্রুটিটি সমাধান করা হয়েছে :)

Question 4

আপনি যদি ওয়েবপ্যাক ব্যবহার করছেন তবে আপনার কোডটিতে এটি স্পষ্টভাবে requireনা বলেই প্রয়োজন হলে প্রতিক্রিয়া লোড করতে পারেন ।

যোগ webpack.config.js :

plugins: [
   new webpack.ProvidePlugin({
      "React": "react",
   }),
],

Http://webpack.github.io/docs/shimming-modules.html#plugin-provideplugin দেখুন

Question 5

সম্ভাব্য কারণগুলি হল ১। আপনি নিজের পৃষ্ঠাতে প্রতিক্রিয়া.জেএস লোড করেননি, ২. আপনি উপরের স্ক্রিপ্টের পরে এটি আপনার পৃষ্ঠাতে লোড করেছেন। সমাধানটি উপরের দেখানো স্ক্রিপ্টের আগে জেএস ফাইল লোড করা হয়।

পুনশ্চ

সম্ভাব্য সমাধান.

আপনি যদি reactওয়েবপ্যাক কনফিগারেশনের অভ্যন্তরে বাহ্যিক বিভাগে উল্লেখ করেন তবে অবশ্যই আপনাকে অবশ্যই আগে এইচটিএমএলে জেএসএস ফাইলগুলি লোড করতে হবেbundle.js
আপনার লাইন আছে তা নিশ্চিত করুন import React from 'react';

Question 6

যুক্ত করার চেষ্টা করুন:

import React from 'react'
import { render } from 'react-dom'
window.React = React

render()ফাংশন আগে ।

এটি কখনও কখনও পপ-আপ ফিরে আসতে ত্রুটি প্রতিরোধ করে:

প্রতিক্রিয়া সংজ্ঞায়িত করা হয় না

Reactউইন্ডোতে যুক্ত করা এই সমস্যার সমাধান করবে।

Question 7

সন্তোষে যুক্ত হচ্ছে:

আপনি প্রতিক্রিয়া দ্বারা লোড করতে পারেন

import React from 'react'

Question 8

import React, { Component, PropTypes } from 'react';

এটিও কাজ করতে পারে!

Question 9

আমি এই ত্রুটিটি পেয়েছি কারণ আমার কোডে আমি react.createClassবড় হাতের পরিবর্তে ছোট হাতের সাথে একটি উপাদান সংজ্ঞা ভুল বানান করেছি React.createClass।

Question 10

আমি একই সমস্যা ছিল। আমি আমদানি করে যার সমাধান Reactএবং ReactDOMনিম্নরূপ মত:

import React from 'react';
import ReactDOM from 'react-dom';

Question 11

আপনি যদি ব্যাবেল এবং প্রতিক্রিয়া 17 ব্যবহার করছেন তবে আপনার কনফিগার করতে "রানটাইম 2:" স্বয়ংক্রিয় "যোগ করার প্রয়োজন হতে পারে।

 {
     "presets": ["@babel/preset-env", ["@babel/preset-react", {
        "runtime": "automatic"
     }]]
 }

Question 12

প্রদর্শিত ত্রুটি

পরে আমদানি প্রতিক্রিয়া

অবশেষে আমদানি প্রতিক্রিয়া-ডোম

ত্রুটির প্রতিক্রিয়া যদি সংজ্ঞায়িত না হয় তবে দয়া করে ==> যুক্ত করুনimport React from 'react';

ত্রুটি যদি রিঅ্যাক্ট হয় ডিওএম সংজ্ঞায়িত না হয় তবে দয়া করে যোগ করুন ==>import ReactDOM from 'react-dom';

Question 13

আপনি টাইপ করা বিষয় ব্যবহার করেন, তাহলে নিশ্চিত করুন যে আপনার যে tsconfig.jsonহয়েছে "jsx": "react"মধ্যে "compilerOptions"।