browserify not working, Uncaught ReferenceError: require is not defined

Question

I'm new to node.js and I've been trying to use a function in my chrome extension that uses require - however, even after installing browserify, bundling up the modules in content.js into bundle.js, and trying to make require global with

browserify content.js --standalone Bundle > bundle.js

I'm still getting

Uncaught ReferenceError: require is not defined

The contents of my html file are at https://pastebin.com/JSUk1C0E
The contents of content.js (where my original code was) are at https://pastebin.com/BY7147R3
The contents of bundle.js are at https://github.com/zzirun/clickerance-bundle/blob/master/bundle.js

Any help would be really appreciated, and I'm really sorry if this is a stupid question hahaha

schnkyl schnkyl · Accepted Answer · 2020-09-18T03:16:02

In order for it to work for me I added...

<script type="text/javascript" src="bundle.js"></script>

before the closing body call in my html page. So your html file should look something like...

<!DOCTYPE html>
<html>
    <head>
        <meta charset = "utf-8"/>
        <title> clickerance </title>
        <link type="text/css" rel="stylesheet" href="style.css"/>
        <script src="bundle.js"></script>
    </head>
    <body>
      <div class="Title"></div>
        <h1> Clickerance </h1>
 
        Dairy  : <input type="checkbox" id="Dairy"><br>
        Meat   : <input type="checkbox" id="Meat"><br>
        Corn   : <input type="checkbox" id="Corn"><br>
        Gluten : <input type="checkbox" id="Gluten"><br>
 
        <p>Which ones you can't eat?</p>
 
        <input id="Submit" type="submit" value="Submit">
    <script type="text/javascript" src="bundle.js"></script>
    </body>
</html>

browserify not working, Uncaught ReferenceError: require is not defined

1 Answers