无法在 express 中加载 javascript 文件

Question

I am making an express web app and I am unable to import a javascript file.

In board.js , I have a line const utility = require('./utility'); . This statement gives an error: ReferenceError: require is not defined .

VSCode suggests to convert const utility = require('./utility'); to an ES6 module. The result after accepting that suggestion is: import { generateRandomData } from './utility'; .

If I do this, the previous error goes away but a new error appears SyntaxError: import declarations may only appear at top level of a module .

This is the folder structure of the project:

server.js :

const express = require("express");
const app = express();
const path = require('path');

const PORT = process.env.PORT || 5000

app.listen(PORT, () => {
    console.log("server started")
});

app.use(express.static(path.join(__dirname + '/public')))

app.get('/', (req,res) => {
    res.sendFile(__dirname + "/index.html")
});

utility.js :

const hello = () => {
    console.log('hello');
}

module.exports.hello = hello;

How else am I supposed to import javascript files in board.js ?

Answer 1

Your public directory is made static via express.static in your server.js. Therefore, calling a public file from client-side will not pass by express but by the client's browser.

If your JS is played directly within a browser, instead of require you should use import and export .

Answer 2

<script src="utility.js"></script>

I added this line in index.html and it solved the problem.

Edit: Sorry, I thought I pasted the line.