[javascript] 노드의 클라이언트 : Uncaught ReferenceError : require is not defined

require()브라우저 / 클라이언트 측 JavaScript에는 존재하지 않기 때문 입니다.

이제 클라이언트 측 JavaScript 스크립트 관리에 대해 몇 가지 선택을해야합니다.

세 가지 옵션이 있습니다.

1. <script>태그를 사용하십시오 .
2. CommonJS 구현을 사용하십시오 . Node.js와 같은 동기 종속성
3. AMD 구현을 사용하십시오 .

CommonJS 클라이언트 측 구현에는 다음이 포함됩니다.

(대부분 배포하기 전에 빌드 단계가 필요합니다)

1. Browserify- 브라우저에서 대부분의 Node.js 모듈을 사용할 수 있습니다. 이것은 내가 개인적으로 좋아하는 것입니다.
2. 웹팩 -모든 작업을 수행합니다 (JS, CSS 등 번들). React.js의 급증으로 인기를 얻었습니다. 어려운 학습 곡선으로 유명합니다.
3. 롤업 -새로운 경쟁자. ES6 모듈을 활용합니다. 트리 셰이 킹 기능을 포함합니다 (사용하지 않는 코드 제거).

Browserify vs (더 이상 사용되지 않는) Component 비교에 대한 자세한 내용을 읽을 수 있습니다 .

AMD 구현에는 다음이 포함됩니다.

1. RequireJS- 클라이언트 측 JavaScript 개발자들에게 매우 인기가 있습니다. 비동기 특성으로 인해 내 취향이 아닙니다.

어떤 것을 고를 지에 대한 검색에서 Bower 에 대해 읽을 것 입니다. Bower는 패키지 종속성만을위한 것이며 CommonJS 및 AMD와 같은 모듈 정의에는 영향을주지 않습니다.

이것이 도움이되기를 바랍니다.

답변

const {ipcRenderer} = require('electron')

function createAddItemWindow() {
//Create new window
addItemWindown = new BrowserWindow({
    width: 300,
    height: 200,
    title: 'Add Item',

    //The lines below solved the issue
    webPreferences: {
        nodeIntegration: true
    }
})}

<script type="module" src="script.js"></script>

import { hello } from './module.js';
...
// alert(hello());

export function hello() {
    return "Hello World";
}

"module": "commonjs"

import { Utils } from "./utils"
export interface Actions {}

"use strict";
exports.__esModule = true;
var utils_1 = require("./utils");
....
utils_1.Utils.doSomething();

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();