javascript - A problem with import in TypeScriptElectron.js - Stack Overflow

admin管理员组

文章数量:1300184

I have a file index.ts:

import { app, BrowserWindow } from 'electron'
let win

app.on('ready', () => {
  win = new BrowserWindow({
    minHeight: 640,
    minWidth: 480,
    frame:false
  })
  win.loadFile('index.html')
})

If I try to run with: npm start, I got an error:

import { app, BrowserWindow } from 'electron'
^^^^^^

SyntaxError: Cannot use import statement outside a module
    at wrapSafe (internal/modules/cjs/loader.js:1051:16)
    at Module._pile (internal/modules/cjs/loader.js:1101:27)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1166:10)
    at Module.load (internal/modules/cjs/loader.js:981:32)
    at Module._load (internal/modules/cjs/loader.js:881:14)
    at Function.Module._load (electron/js2c/asar.js:769:28)
    at loadApplicationPackage (D:\VS Projects\Electron App\node_modules\electron\dist\resources\default_app.asar\main.js:109:16)
    at Object.<anonymous> (D:\VS Projects\Electron App\node_modules\electron\dist\resources\default_app.asar\main.js:155:9)
    at Module._pile (internal/modules/cjs/loader.js:1145:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1166:10)

My package.json:

{
  "name": "electron-app",
  "version": "1.0.0",
  "description": "",
  "main": "index.ts",
  "dependencies": {
    "electron": "^10.1.2"
  },
  "devDependencies": {},
  "scripts": {
    "start": "electron .",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "type": "module"
}

How I can solve it?

I have a file index.ts:

import { app, BrowserWindow } from 'electron'
let win

app.on('ready', () => {
  win = new BrowserWindow({
    minHeight: 640,
    minWidth: 480,
    frame:false
  })
  win.loadFile('index.html')
})

If I try to run with: npm start, I got an error:

import { app, BrowserWindow } from 'electron'
^^^^^^

SyntaxError: Cannot use import statement outside a module
    at wrapSafe (internal/modules/cjs/loader.js:1051:16)
    at Module._pile (internal/modules/cjs/loader.js:1101:27)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1166:10)
    at Module.load (internal/modules/cjs/loader.js:981:32)
    at Module._load (internal/modules/cjs/loader.js:881:14)
    at Function.Module._load (electron/js2c/asar.js:769:28)
    at loadApplicationPackage (D:\VS Projects\Electron App\node_modules\electron\dist\resources\default_app.asar\main.js:109:16)
    at Object.<anonymous> (D:\VS Projects\Electron App\node_modules\electron\dist\resources\default_app.asar\main.js:155:9)
    at Module._pile (internal/modules/cjs/loader.js:1145:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1166:10)

My package.json:

{
  "name": "electron-app",
  "version": "1.0.0",
  "description": "",
  "main": "index.ts",
  "dependencies": {
    "electron": "^10.1.2"
  },
  "devDependencies": {},
  "scripts": {
    "start": "electron .",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "type": "module"
}

How I can solve it?

• javascript
• import
• electron

Share Follow edited Sep 17, 2020 at 17:16 alexsey bobrovitch asked Sep 17, 2020 at 17:05 alexsey bobrovitchalexsey bobrovitch 10733 silver badges88 bronze badges 7

• Electron will not work with import statements. It uses a Nodejs based environment which doesn't support this syntax. You have to use require instead. – Chris Commented Sep 17, 2020 at 17:07
• See the getting started page for electron – Chris Commented Sep 17, 2020 at 17:07
• Oh, sorry, I'm make a mistake! Its not JS, I use Typescript with electron. – alexsey bobrovitch Commented Sep 17, 2020 at 17:15
• 1 And what is that additional setup? – alexsey bobrovitch Commented Sep 17, 2020 at 17:19
• 1 Okay, it's at least something... Thanks, @Chris! You can do this as answer – alexsey bobrovitch Commented Sep 17, 2020 at 17:24

 |  Show 2 more ments

2 Answers 2

Sorted by: Reset to default 4

It looks like you are trying to use TypeScript with Electron. Electron has types available, however it doesn't directly support executing TypeScript right out of the box. You will need to perform some additional steps to get things working. This goes a bit out of scope of an answer, and would need to be more of a tutorial or example, so I'll provide you with an example from GitHub.

You can view an example of getting started with TypeScript and Electron Here.

Electron runs through node.js and node.js is behind and uses monjs import syntax.

To import we do:

const {app} = require("electron");

// equivalent to
//import {app} from 'electron' <- don't use in electron

to export we do:

module.exports = app;

// equivalent to
//export default app; <- don't use in electron

本文标签： javascriptA problem with import in TypeScriptElectronjsStack Overflow