Node.js 上的客户端:未捕获的 ReferenceError:未定义要求 [英] Client on Node.js: Uncaught ReferenceError: require is not defined
问题描述
我正在使用 Node.js、Express.js 和 Jade 编写应用程序 组合.
I am writing an application with the Node.js, Express.js, and Jade combination.
我有文件 client.js
,它被加载到客户端.在那个文件中,我有从其他 JavaScript 文件调用函数的代码.我的尝试是使用
I have file client.js
, which is loaded on the client. In that file I have code that calls functions from other JavaScript files. My attempt was to use
var m = require('./messages');
为了加载 messages.js
的内容(就像我在服务器端所做的那样),然后从该文件调用函数.但是,require
并没有在客户端定义,它会抛出 Uncaught ReferenceError: require is not defined
形式的错误.
in order to load the contents of messages.js
(just like I do on the server side) and later on call functions from that file. However, require
is not defined on the client side, and it throws an error of the form Uncaught ReferenceError: require is not defined
.
这些其他 JavaScript 文件也在客户端运行时加载,因为我将链接放在网页的标题处.所以客户端知道从这些其他文件中导出的所有函数.
These other JavaScript files are also loaded at runtime at the client, because I place the links at the header of the webpage. So the client knows all the functions that are exported from these other files.
如何从打开到服务器的套接字的主 client.js
文件中的这些其他 JavaScript 文件(例如 messages.js
)调用这些函数?
How do I call these functions from these other JavaScript files (such as messages.js
) in the main client.js
file that opens the socket to the server?
推荐答案
这是因为 require()
在浏览器/客户端 JavaScript 中不存在.
This is because require()
does not exist in the browser/client-side JavaScript.
现在您将不得不对客户端 JavaScript 脚本管理做出一些选择.
Now you're going to have to make some choices about your client-side JavaScript script management.
您有三个选择:
- Use the
<script>
tag. - Use a CommonJS implementation. It has synchronous dependencies like Node.js
- Use an asynchronous module definition (AMD) implementation.
CommonJS 客户端实现包括(其中大多数需要在部署前执行构建步骤):
CommonJS client side-implementations include (most of them require a build step before you deploy):
- Browserify - 您可以在浏览器中使用大多数 Node.js 模块.这是我个人的最爱.
- Webpack - 无所不能(捆绑 JavaScript 代码、CSS 等).它因 React 的激增而广受欢迎,但因其艰难的学习曲线而臭名昭著.
- Rollup - 一个新的竞争者.它利用 ES6 模块并包括摇树功能(删除未使用的代码).
- Browserify - You can use most Node.js modules in the browser. This is my personal favorite.
- Webpack - Does everything (bundles JavaScript code, CSS, etc.). It was made popular by the surge of React, but it is notorious for its difficult learning curve.
- Rollup - a new contender. It leverages ES6 modules and includes tree-shaking abilities (removes unused code).
你可以阅读更多关于我对的比较Browserify 与(不推荐使用的)组件.
You can read more about my comparison of Browserify vs (deprecated) Component.
AMD 实施包括:
- RequireJS - 在客户端 JavaScript 开发人员中非常流行.由于其异步性质,这不是我的口味.
- RequireJS - Very popular amongst client-side JavaScript developers. It is not my taste because of its asynchronous nature.
请注意,在您选择要使用的那个时,您将阅读有关 Bower 的信息.Bower 仅适用于包依赖项,对 CommonJS 和 AMD 等模块定义没有意见.
Note, in your search for choosing which one to go with, you'll read about Bower. Bower is only for package dependencies and is unopinionated on module definitions like CommonJS and AMD.
这篇关于Node.js 上的客户端:未捕获的 ReferenceError:未定义要求的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!