Categories
Development

“Module not found: Error: Can’t resolve ‘electron-is-dev'” in electron & typescript & webpack project

I’m using Electron and Typescript with webpack.
And I’m gonna add react.js.

But I typed “npx webpack”, I got an error.

It says “electron-is-dev module is not found”, but I already installed it.

 ERROR in ./src/main/window.ts
    Module not found: Error: Can't resolve 'electron-is-dev' in 'project-path/src/main'
     @ ./src/main/window.ts 2:0-36 12:35-40
     @ ./src/main/app.ts

I can’t find how to solve this error.

window.ts

import { app, BrowserWindow } from 'electron';
import isDev from 'electron-is-dev';

(...)

webpack.config.js

const path = require('path');

module.exports = [
    {
        target: 'electron-main',
        entry: path.join(__dirname, 'src/main/app.ts'),
        mode: 'development',
        module: {
            rules: [
                {
                    test: /\.ts$/,
                    include: path.join(__dirname, 'src/main'),
                    use: 'ts-loader',
                    exclude: [
                        /node_modules/,
                        path.join(__dirname, 'src/renderer')
                    ]
                }
            ]
        },
        output: {
            path: path.join(__dirname, 'build'),
            filename: 'electron.js'
        },
        resolve: {
            extensions: ['.tsx', '.ts', 'js']
        },
        node: {
            __dirname: false
        }
    }
];

And package.json:

{
    "name": "electron-react-typescript",
    "version": "0.0.1",
    "description": "",
    "main": "build/electron.js",
    "scripts": {
        "test": "echo \"Error: no test specified\" && exit 1"
    },
    "keywords": [],
    "author": "",
    "license": "ISC",
    "devDependencies": {
        "@types/electron-devtools-installer": "^2.2.0",
        "@types/react": "^16.9.19",
        "@types/react-dom": "^16.9.5",
        "@typescript-eslint/eslint-plugin": "2.x",
        "@typescript-eslint/parser": "2.x",
        "babel-eslint": "10.x",
        "concurrently": "^5.1.0",
        "electron": "^8.0.0",
        "electron-builder": "^22.3.2",
        "eslint": "6.x",
        "eslint-config-prettier": "^6.10.0",
        "eslint-config-react-app": "^5.2.0",
        "eslint-plugin-flowtype": "3.x",
        "eslint-plugin-import": "2.x",
        "eslint-plugin-jsx-a11y": "6.x",
        "eslint-plugin-react": "7.x",
        "eslint-plugin-react-hooks": "1.x",
        "html-webpack-plugin": "^3.2.0",
        "prettier": "^1.19.1",
        "source-map-loader": "^0.2.4",
        "ts-loader": "^6.2.1",
        "typescript": "^3.7.5",
        "webpack": "^4.41.5",
        "webpack-cli": "^3.3.10",
        "webpack-dev-server": "^3.10.3"
    },
    "dependencies": {
        "electron-devtools-installer": "^2.2.4",
        "electron-is-dev": "^1.1.0",
        "react": "^16.12.0",
        "react-dom": "^16.12.0"
    }
}

And I’m using eslint and prettier.

Leave a Reply

Your email address will not be published. Required fields are marked *