टाइपस्क्रिप्ट संदर्भ संदर्भ: निर्यात परिभाषित नहीं है

Question

आधिकारिक पुस्तिका के बाद एक मॉड्यूल को लागू करने की कोशिश कर रहा है , मुझे यह त्रुटि संदेश मिलता है:

बिना संदर्भ संदर्भ: निर्यात परिभाषित नहीं है

app.js पर: 2

लेकिन कहीं भी मेरे कोड में मैं कभी भी नाम का उपयोग नहीं करता हूं exports।

मैं इसे कैसे ठीक करूं?

---

फ़ाइलें

app.ts

let a = 2;
let b:number = 3;

import Person = require ('./mods/module-1');

मॉड्यूल-1.T

 export class Person {
  constructor(){
    console.log('Person Class');
  }
}
export default Person;

tsconfig.json

{
   "compilerOptions": {
        "module": "commonjs",
        "target": "es5",
        "noImplicitAny": false,
        "sourceMap": true,
        "outDir": "scripts/"
    },
    "exclude": [
        "node_modules"
    ]
}

Comments

कृपया स्क्रीन शॉट्स का उपयोग करने के बजाय प्रश्न में त्रुटि पाठ को कॉपी और पेस्ट करें।

— इगोर

क्या आप वाकई इसके बजाय exportsएक s के साथ टाइप नहीं कर रहे हैं export? यह त्रुटि संदेश को समझाएगा क्योंकि s गलत है।

— इगोर

मैं निर्यात नहीं निर्यात करता

— जॉर्ज सी।

रिपॉजिटरी के किसी भी उदाहरण से पता चलता है कि गोना 10000% काम करता है

— जॉर्ज सी।

यह कहां चलाया जा रहा है? एक वेब पेज पर? एक नोड.जेएस सर्वर पर? आपको रन-टाइम वातावरण में एक मॉड्यूल लोडर की आवश्यकता होगी जो कि जावास्क्रिप्ट आखिरकार चलता है। संकलक झंडे से आप आम का उपयोग कर रहे हैं। मैं आम लोगों से परिचित नहीं हूं, लेकिन टाइपस्क्रिप्ट मॉड्यूल के काम करने से पहले आपको आम सेट प्राप्त करने की आवश्यकता होगी या आपको दूसरे मॉड्यूल लोडर (जैसे आवश्यकता) को बदलने की आवश्यकता होगी और इसे एक सेट अप करना होगा।

— माइक वोड्केज़क

Answer 1

संपादित करें:

यदि आप अभी लक्ष्य es5नहीं कर रहे हैं, तो यह जवाब काम नहीं कर सकता है, मैं उत्तर को और अधिक पूर्ण बनाने का प्रयास करूंगा।

मूल उत्तर

यदि कॉमनजेएस स्थापित नहीं है ( जो परिभाषित करता हैexports ), तो आपको इस लाइन को अपने से हटाना होगा tsconfig.json:

 "module": "commonjs",

टिप्पणियों के अनुसार, यह अकेले बाद के संस्करणों के साथ काम नहीं कर सकता है tsc। अगर ऐसा है, तो आप कॉमनजस, सिस्टमजस या रिक्जेस्ट जैसे मॉड्यूल लोडर स्थापित कर सकते हैं और फिर उसे निर्दिष्ट कर सकते हैं।

ध्यान दें:

अपनी main.jsफ़ाइल को देखें जो tscउत्पन्न हुई है। आपको यह सबसे ऊपर मिलेगा:

Object.defineProperty(exports, "__esModule", { value: true });

यह त्रुटि संदेश की जड़ है, और हटाने के बाद "module": "commonjs",, यह गायब हो जाएगा।

Comments

हाँ, मैंने अपनी .ts फ़ाइल को पुन: स्थापित किया और त्रुटि टिप्पणी करने के बाद भी मौजूद है "module": "commonJs",:(

— Acidic9

यदि कॉमनजेएस स्थापित करने से यह त्रुटि दूर हो जाएगी, तो कोई वास्तव में कॉमनजस कैसे स्थापित करेगा? मैंने एक घंटे के Googling का बेहतर हिस्सा बिताया है, और मुझे ऐसा करने का कोई निर्देश नहीं मिला है। किसी को कर सकते हैं कृपया समझाने?

— स्टर्म

@Sturm मेरा उत्तर भ्रमित करने वाला शब्द हो सकता है। कॉमनजेएस केवल एक विनिर्देश है। आप यहां कार्यान्वयन की (आवश्यक रूप से संपूर्ण नहीं) सूची पा सकते हैं: en.wikipedia.org/wiki/CommonJS

— iFreilicht

मेरे पास मॉड्यूल है: amd, मॉड्यूल नहीं: commonjs, और मेरे पास मेरे ट्रांसजेड .js फ़ाइल में यह लाइन है।

— pabrams

यदि आपके tsconfig.json में ES3 या ES5 के रूप में लक्ष्य है तो टाइपस्क्रिप्ट स्वतः ही आपके मॉड्यूल को कॉमनजस में सेट कर देगा यदि यह परिभाषित नहीं है। मॉड्यूल निकालना पर्याप्त नहीं है, आपको इसके बजाय कुछ और सेट करने की आवश्यकता है - टाइप करेंcriptcriptlang.org/docs/handbook/compiler-options.html

— Jake

Answer 2

इस मुद्दे के लिए कुछ अन्य समाधान

• जावास्क्रिप्ट के अन्य संदर्भों से पहले निम्न पंक्ति जोड़ें। यह एक अच्छा सा हैक है।

   <script>var exports = {};</script>

• यह समस्या टाइपस्क्रिप्ट के नवीनतम संस्करण के साथ होती है, टाइप्टर संस्करण 2.1.6 के संदर्भ में इस त्रुटि को समाप्त किया जा सकता है

Comments

@ChuckLeButt आशा है कि यह stackoverflow.com/questions/19059580/… में

— वेंकटेश मुनियांदी

मुझे नफरत है कि यह काम करता है! और यह निश्चित रूप से काम करता है। क्या कुछ टाइप करने के लिए टाइपस्क्रिप्ट प्राप्त करने का कोई तरीका नहीं है जो नोड की उम्मीद है? क्या यह भी शिकायत है कि नोड है? या यह ब्राउज़र है? मैं यह नहीं समझ सकता कि समस्या वास्तव में क्या है।

— कुशल ज़िमबर्ग

Answer 3

npm install @babel/plugin-transform-modules-commonjs

और .babelrc प्लगइन्स में जोड़ें ने मेरा प्रश्न हल कर दिया।

Answer 4

मैंने "type": "module"क्षेत्र को हटाकर समस्या हल कर दी package.json।

Answer 5

मेरा समाधान मेरे द्वारा जोड़ी गई छोटी-छोटी चालों के साथ ऊपर की सभी चीज़ों का योग है, मूल रूप से मैंने इसे अपने html कोड में जोड़ा था

<script>var exports = {"__esModule": true};</script>
<script src="js/file.js"></script>

यहां तक ​​कि अगर आप इलेक्ट्रॉन या कुछ का उपयोग कर रहे हैं import, requireतो इसके बजाय आपको इसका उपयोग करने की अनुमति देता है, और यह टाइपस्क्रिप्ट 3.5.1, लक्ष्य: es3 -> esnext के साथ ठीक काम करता है।

Comments

यहाँ कुछ प्रगति हुई, त्रुटि बस बदल गईapp.js:3 Uncaught ReferenceError: require is not defined

— मुहम्मद मौसा

यह तब होता है जब विंडो बनाते समय नोडइन्ग्रेशन झूठे पर सेट होता है, तो त्रुटि तब होती है क्योंकि आपने अपना इलेक्ट्रॉनजेएस अपडेट किया था या आप एक पुराने स्रोत का अनुसरण कर रहे हैं। डिफॉल्ट रूप से नोडइन्ग्रेशन सही था, अब यह गलत है, इसलिए यदि आप रेंडर प्रक्रिया में नोडजेएस का उपयोग करना चाहते हैं, तो आपको इसे मैन्युअल रूप से सक्षम करना होगा। देखें [इलेक्ट्रॉन की आवश्यकता () परिभाषित नहीं है] [1] [१]: stackoverflow.com/questions/44391448/…

— 51:

मैं इलेक्ट्रान का उपयोग नहीं कर रहा हूँ, वैसे भी मैंने बंडल बनाने के लिए पार्सल को जोड़कर अपने मामले में हल किया और अन्य पेचीदा तरीके निकाले

— मुहम्मद मौसा

Answer 6

मुझे भी यही समस्या थी और इसे " es5 " लाइब्रेरी में tsconfig.json के साथ जोड़कर हल किया :

{
    "compilerOptions": {
        "target": "es5", //defines what sort of code ts generates, es5 because it's what most browsers currently UNDERSTANDS.
        "module": "commonjs",
        "moduleResolution": "node",
        "sourceMap": true,
        "emitDecoratorMetadata": true, //for angular to be able to use metadata we specify in our components.
        "experimentalDecorators": true, //angular needs decorators like @Component, @Injectable, etc.
        "removeComments": false,
        "noImplicitAny": false,
        "lib": [
            "es2016",
            "dom",
            "es5"
        ]
    }
}

Answer 7

यदि आपके कंपाइलर का लक्ष्य ES6 पर सेट है, तो अभी भी इस समस्या से जूझ रहे लोगों के लिए, आपको मॉड्यूल परिवर्तन को छोड़ने के लिए बेबल को बताने की आवश्यकता है। ऐसा करने के लिए इसे अपनी .babelrcफ़ाइल में जोड़ें

{
  "presets": [ ["env", {"modules": false} ]]
}

Comments

धन्यवाद दोस्त! मैं पुराने कोड बेस के साथ काम करने की कोशिश कर रहा हूं, जो सभी वैश्विक रूप से डंप करता है और <script>टैग के साथ ब्राउज़र में स्क्रिप्ट शामिल किए जाते हैं । मैं पुराने कोड के साथ मॉड्यूल का उपयोग करने की उम्मीद कर रहा था और ऐसा लगता है कि यह संभव नहीं है। यह कम से कम मुझे ES6 का उपयोग करने की अनुमति देता है और मुझे बाद में निर्यात से निपटने देता है।

— ह्यूगी

ऐसा करने से मुझे निम्नलिखित त्रुटि मिली: हटाए गए बैबल 5 विकल्प का उपयोग करना: .modules - विकल्प में संबंधित मॉड्यूल ट्रांसफॉर्म प्लगइन का उपयोग करें plugins। की जाँच करें babeljs.io/docs/plugins/#modules

— chharvey

Answer 8

यह moduleसंकलक विकल्प की स्थापना द्वारा तय किया गया है es6:

{
  "compilerOptions": {     
    "module": "es6",
    "target": "es5",    
  }
}

Answer 9

मेरी भी यही त्रुटि थी। मेरे मामले में ऐसा इसलिए था क्योंकि हमारे टाइपस्क्रिप्ट AngularJS प्रोजेक्ट में इस तरह का एक पुराने ज़माने का आयात विवरण था:

import { IAttributes, IScope } from "angular";

जो इस तरह जावास्क्रिप्ट के लिए संकलित किया गया था:

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });

पुराने दिनों में इसकी आवश्यकता थी क्योंकि हम तब IAttributesकोड में उपयोग करते थे और टाइपस्क्रिप्ट को यह नहीं पता होता कि इसके साथ क्या करना है। लेकिन आयात विवरण को हटाने के बाद, और उन दो जावास्क्रिप्ट लाइनों IAttributesको परिवर्तित करने के लिए ng.IAttributesगायब हो गया - और इसलिए त्रुटि संदेश आया।

Comments

यह एक टाइपस्क्रिप्ट प्रकार के लिए कैसे काम करेगा? मुझे इसे आयात करना है, इसलिए टाइपस्क्रिप्ट इसे संकलित करता है।

— ब्लू जूल

"टाइपस्क्रिप्ट प्रकार" से आपका क्या अभिप्राय है? यदि यह एक पूर्णांक प्रकार है जिसे टाइपस्क्रिप्ट द्वारा जाना जाता है - जैसे कि संख्या या स्ट्रिंग - तो आप इसे तुरंत उपयोग कर सकते हैं। यदि आप एक मॉड्यूल में अपने स्वयं के प्रकारों को परिभाषित करते हैं, तो इसे जांचें: टाइपस्क्रिप्ट

— lang.org/docs/handbook/modules.html

मेरा मतलब था कि बाहरी लाइब्रेरी की प्रकार @ npmjs.com/package/@types/jquery से @ jquery । मेरे टाइपस्क्रिप्ट कोड के भीतर से $ चर को प्रयोग करने योग्य बनाने के लिए, मैंने इसे अपने कोड में रखा: आयात * को "jquery" से $ के रूप में;

— ब्लू जूल

मैं es5 को लक्षित कर रहा हूं, क्या मुझे इस कार्य को करने के लिए अन्य पुस्तकालय की आवश्यकता है?

— BluE

Answer 10

सीधे शब्दों में कहें libraryTarget: 'umd', जैसे

const webpackConfig = {
  output: {
    libraryTarget: 'umd' // Fix: "Uncaught ReferenceError: exports is not defined".
  }
};

module.exports = webpackConfig; // Export all custom Webpack configs.

Answer 11

मेरे लिए, "esModuleInterop": truetsconfig.json से हटाकर चाल चली गई।

Answer 12

कुछ ASP.NET प्रोजेक्ट्स के लिए importऔर exportआपके टाइपस्क्रिप्ट में बिल्कुल भी उपयोग नहीं किया जा सकता है।

प्रश्न की त्रुटि तब दिखाई दी जब मैंने ऐसा करने का प्रयास किया और मुझे केवल बाद में पता चला कि मुझे केवल जेएस स्क्रिप्ट को दृश्य में जोड़ने की आवश्यकता थी :

<script src="~/scripts/js/[GENERATED_FILE].Index.js" asp-append-version="true"></script>

Answer 13

ऊपर दिए गए @iFreilicht का प्रयास करें। यदि आपने वेबपैक और सभी को स्थापित करने के बाद काम नहीं किया है, तो हो सकता है कि आपने कहीं से ऑनलाइन एक वेबपैक कॉन्फ़िगरेशन की प्रतिलिपि बनाई हो और वहां कॉन्फ़िगर किया गया हो जो आप चाहते हैं कि आउटपुट कॉमनजेएस को गलती से समर्थन दे। सुनिश्चित करें कि यह मामला नहीं है webpack.config.js:

module.exports = {
  mode: process.env.NODE_ENV || "development",
  entry: { 
    index: "./src/js/index.ts"
  },
  ...
  ...
  output: {
    libraryTarget: 'commonjs',         <==== DELETE THIS LINE
    path: path.join(__dirname, 'build'),
    filename: "[name].bundle.js"
  }
};

Answer 14

एक ही मुद्दा था और जेएस पैकेज लोडिंग ऑर्डर को बदलकर इसे ठीक किया।

उस क्रम की जांच करें जिसमें आपके लिए आवश्यक पैकेजों को बुलाया जा रहा है और उन्हें एक उपयुक्त क्रम में लोड करें।

मेरे विशिष्ट मामले में (मॉड्यूल बंडलर का उपयोग नहीं) मुझे लोड करने की आवश्यकता थी Redux, फिर Redux Thunk, फिर React Redux। लोड करने React Reduxसे पहले Redux Thunkमुझे दे देंगे exports is not defined।

Answer 15

नोट: यह ओपी के जवाब के लिए लागू नहीं हो सकता है, लेकिन मुझे यह त्रुटि मिल रही थी, और मैंने इसे कैसे हल किया।

इसलिए मुझे जो समस्या आ रही थी, वह यह थी कि मुझे यह त्रुटि तब हो रही थी जब मैंने एक विशेष CDN से 'js' लाइब्रेरी को पुनः प्राप्त किया था।

केवल एक गलत चीज जो मैं कर रहा था वह सीडीएन की cjsनिर्देशिका से आयात कर रहा था जैसे: https://cdn.jsdelivr.net/npm/@popperjs/core@2.4.0/dist/cjs/popper.min.js

dist/cjsभाग नोटिस ? बस यहीं समस्या थी।

मैं अपने मामले में सीडीएन (jsdelivr) पर वापस गया और umdफ़ोल्डर खोजने के लिए नेविगेट किया । और मुझे एक और सेट मिल सकता है popper.min.jsजो आयात करने के लिए सही फ़ाइल थी https://cdn.jsdelivr.net/npm/@popperjs/core@2.4.0/dist/umd/popper.min.js:।

Answer 16

  {
    "compileOnSave": false,
    "compilerOptions": {
      "baseUrl": "./",
      "outDir": "./dist",
      "sourceMap": true,
      "declaration": false,
      "module": "esnext",
      "moduleResolution": "node",
      "emitDecoratorMetadata": true,
      "experimentalDecorators": true,
      "target": "es5",
      "typeRoots": ["node_modules/@types"],
      "lib": ["es2018", "dom"]
    }
  }

Comments

StackOverflow में आपका स्वागत है। कृपया अपने उत्तर या कुछ स्पष्टीकरण के लिए कुछ संदर्भ जोड़ें ताकि उपयोगकर्ता समझ सके कि क्या किया गया था। केवल JSON पोस्ट करना उतना उपयोगी नहीं हो सकता ...

— ब्रूनो मोंटेइरो

Answer 17

मेरे पास एक ही मुद्दा था, लेकिन मेरे सेटअप को एक अलग समाधान की आवश्यकता थी।

मैं फ़ाइल के create-react-app-rewiredसाथ पैकेज का उपयोग कर रहा हूं config-overrides.js। पहले, मैं addBabelPresets( override()विधि में) आयात का उपयोग कर रहा था customize-craऔर उन प्रीसेट्स को एक अलग फ़ाइल में सार करने का फैसला किया। संयोग से, इससे मेरी समस्या हल हो गई।

मैं जोड़ा useBabelRc()करने override()में विधि config-overrides.jsऔर एक बनाया babel.config.jsनिम्नलिखित के साथ फाइल:

module.exports = {
    presets: [
        '@babel/preset-react',
        '@babel/preset-env'
    ],
}