Also schreibe ich eine Anwendung mit der Kombination aus Knoten, Express und Jade.
Ich habe client.js
, der auf dem Client geladen ist. In dieser Datei habe ich Code, der Funktionen aus anderen JavaScript-Dateien aufruft. Mein Versuch war zu benutzen
var m = require('./messages');
um den Inhalt von messages.js
zu laden (genau wie auf der Serverseite) und später Funktionen aus dieser Datei aufzurufen. require
ist jedoch auf der Clientseite nicht definiert und gibt einen Fehler in der Form Uncaught ReferenceError: require is not defined
aus.
Diese anderen JS-Dateien werden zur Laufzeit auch auf dem Client geladen, weil ich die Links im Header der Webseite platziere. Der Client kennt also alle Funktionen, die aus diesen anderen Dateien exportiert werden.
Wie rufe ich diese Funktionen aus diesen anderen JS-Dateien (wie messages.js
) in der client.js
-Hauptdatei auf, die den Socket für den Server öffnet?
Dies liegt daran, dass require()
nicht im Browser/clientseitigen JavaScript vorhanden ist.
Jetzt müssen Sie einige Entscheidungen bezüglich der clientseitigen JavaScript-Skriptverwaltung treffen.
Sie haben drei Möglichkeiten:
<script>
-Tag.CommonJS clientseitige Implementierungen umfassen:
(Die meisten von ihnen erfordern vor dem Bereitstellen einen Build-Schritt).
Sie können mehr über meinen Vergleich von Browserify vs Component lesen.
AMD Implementierungen umfassen:
Beachten Sie, dass Sie bei Ihrer Suche nach dem für Sie passenden auswählen, über Bower . Bower ist nur für Paketabhängigkeiten und wird von Moduldefinitionen wie CommonJS und AMD nicht verwendet.
Hoffe das hilft einigen.
ES6: In html Include-Haupt-js-Datei mit dem Attribut type="module"
( Browserunterstützung ):
<script type="module" src="script.js"></script>
Und in script.js
file füge eine andere Datei wie diese ein:
import { hello } from './module.js';
...
// alert(hello());
In 'module.js' müssen Sie Exportfunktion/Klasse importieren
export function hello() {
return "Hello World";
}
Arbeit Beispiel hier .
In meinem Fall habe ich eine andere Lösung verwendet.
Da das Projekt keine CommonJs erfordert und ES3-Kompatibilität haben muss (Module werden nicht unterstützt), brauchen Sie nur entfernen Sie alle export - und import -Anweisungen aus Ihrem code , weil Ihre tsconfig enthält nicht
"module": "commonjs"
Verwenden Sie jedoch Import- und Exportanweisungen in Ihren referenzierten Dateien
import { Utils } from "./utils"
export interface Actions {}
Der endgültig generierte Code enthält (zumindest für TypeScript 3.0) immer solche Zeilen
"use strict";
exports.__esModule = true;
var utils_1 = require("./utils");
....
utils_1.Utils.doSomething();
Selbst wenn dies nicht funktioniert, denke ich, ist die beste Lösung Browser-Browser:
-common.js-
module.exports = {
func1: function () {
console.log("I am function 1");
},
func2: function () {
console.log("I am function 2");
}
};
-getFunc1.js-
var common = require('./common');
common.func1();
Ich komme aus einer Elektronenumgebung, in der ich IPC Kommunikation zwischen einem Renderer-Prozess und dem Hauptprozess benötige. Der Renderer-Prozess befindet sich in einer HTML-Datei zwischen Skript-Tags und generiert denselben Fehler. Die Linie
const {ipcRenderer} = require('electron')
wirft den Uncaught ReferenceError: require ist nicht definiert
Ich konnte das umgehen, indem ich die Knotenintegration als wahr angab, als das Browserfenster (in das diese HTML-Datei eingebettet ist) ursprünglich im Hauptprozess erstellt wurde.
function createAddItemWindow() {
//Create new window
addItemWindown = new BrowserWindow({
width: 300,
height: 200,
title: 'Add Item',
//The lines below solved the issue
webPreferences: {
nodeIntegration: true
}
})}
Das hat das Problem für mich gelöst. Die Lösung wurde vorgeschlagen hier . Hoffe das hilft jemand anderem. Prost.