如何解决"require is not defined"的问题？

Question

我按照这个教程创建了一个使用vuejs和laravel的聊天应用程序。

在app.js:8中，我遇到了require未定义的错误。我尝试了很多方法，但似乎没有解决这个问题。

我尝试使用requirejs，所以我在我的视图中添加了这两行代码。

<script type="text/javascript" data-main="{{ url('resources/assets/js/app.js')}}" src="https://requirejs.org/docs/release/2.3.5/minified/require.js"></script>
<script src="{{ url('resources/assets/js/app.js')}}"></script>

这是我的app.js代码：

requirejs.config({
baseUrl: 'js/lib',
paths: {
    app: '../app'
}
});

requirejs(['jquery', 'canvas', 'app/sub'],
 function   ($,        canvas,   sub) {
});
// this line below is causing the problem
require('./bootstrap');

window.Vue = require('vue');
Vue.use(require('vue-chat-scroll'));

Vue.component('chat-message', require('./components/ChatMessage.vue'));
Vue.component('chat-log', require('./components/ChatLog.vue'));
Vue.component('user-log', require('./components/UserLog.vue'));
Vue.component('chat-composer', require('./components/ChatComposer.vue'));

- Youssef Boudaya

---

欢迎来到Stackoverflow，请发布您代码的最小版本，因为我们不是魔术师，绝对不知道第8行是什么。 - Borjante

阅读如何提出一个好问题？和如何创建一个简洁、完整且可验证的示例。 - Decade Moon

我刚刚更新了我的问题，包括导致错误的那一行。 - Youssef Boudaya

Answer 1

您不应该直接引用resources/assets/js/app.js。 require是由webpack使用的工具，它将您的js资产捆绑成一个单独的文件。

相反，您应该运行npm run development，然后像这里一样引用js/app.js。

请参阅Laravel Mix文档。

- noj

---

所以我认为我的脚本应该像这样：<script type="text/javascript" data-main="js/app.js" src="https://requirejs.org/docs/release/2.3.5/minified/require.js"></script> <script src="js/app.js"></script> - Youssef Boudaya

你可以移除 requirejs。这里有一个更详细的例子：https://laravel-mix.com/docs/3.0/workflow - noj

Answer 2

你可能需要将这个添加到你的项目中: https://requirejs.org/docs/release/2.3.5/minified/require.js

对于你的问题，有一个类似的解决方案在这里: Javascript require() 函数出现 ReferenceError: require 未定义错误

- hbled

---

我刚刚更新了我的问题，展示了我的app.js代码，其中出现了错误。现在使用requirejs时，我应该如何更改那个文件？ - Youssef Boudaya