简体   繁体   English

laravel 回声:“未捕获的参考错误:未定义回声”

[英]laravel echo : “Uncaught ReferenceError: Echo is not defined”

im trying to work laravel echo with pusher, im working on windows localhost (wamp / laravel 5.8)我正在尝试使用推杆工作 laravel 回声,我正在处理 windows 本地主机(wamp / laravel 5.8)

so i've installed required libs所以我已经安装了所需的库

my package.json我的 package.json

{
    "private": true,
    "scripts": {
        "dev": "npm run development",
        "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
        "watch": "npm run development -- --watch",
        "watch-poll": "npm run watch -- --watch-poll",
        "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
        "prod": "npm run production",
        "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
    },
    "devDependencies": {
        "axios": "^0.19",
        "bootstrap": "^4.1.0",
        "cross-env": "^5.1",
        "jquery": "^3.2",
        "laravel-echo": "^1.8.0",
        "laravel-mix": "^4.0.7",
        "lodash": "^4.17.13",
        "popper.js": "^1.12",
        "pusher-js": "^6.0.3",
        "resolve-url-loader": "^2.3.1",
        "sass": "^1.15.2",
        "sass-loader": "^7.1.0",
        "vue": "^2.5.17",
        "vue-template-compiler": "^2.6.11"
    }
}

resources/js/app.js资源/js/app.js

require('./bootstrap');

window.Vue = require('vue');

resources/js/bootstrap.js资源/js/bootstrap.js

window._ = require('lodash');
try {
    window.Popper = require('popper.js').default;
    window.$ = window.jQuery = require('jquery');

    require('bootstrap');
} catch (e) {}

window.axios = require('axios');

window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
import Echo from 'laravel-echo';
window.xxx = 'xxx';
window.Pusher = require('pusher-js');

window.Echo = new Echo({
    broadcaster: 'pusher',
    key: process.env.MIX_PUSHER_APP_KEY,
    cluster: process.env.MIX_PUSHER_APP_CLUSTER,
    encrypted: true
});

i ran我跑了

npm run dev

here is the result这是结果

在此处输入图像描述

in my view i have在我看来我有

<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <title>Laravel</title>
        <meta name="csrf-token" content="{{ csrf_token() }}">
        <script src="{{ asset('js/app.js') }}" defer></script>
        <link href="{{ asset('css/app.css') }}" rel="stylesheet">
    </head>
    <body>

    <script>
        console.log(Echo);
    </script>


    </body>
</html>

i keep getting我不断得到

Uncaught ReferenceError: Echo is not defined

i even added我什至加了

window.xxx = 'xxx';

in bootstrap.js to see if i can eccess xxx variable in my view but thats undefined as well (btw im not sure if thats how it works !! just trying some stuff )在 bootstrap.js 中查看我是否可以在我的视图中访问 xxx 变量,但这也是未定义的(顺便说一句,我不确定它是否是这样工作的!!只是尝试一些东西)

any idea?任何想法?

my folders structure is like我的文件夹结构就像

/pusher (root folder)
  +app
  +vendor
  +node_modules
  +resources/js
  -public
    index.php
    css/app.css
    js/app.js

Try removing defer from the <script.. portion.尝试从<script..部分中删除defer

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM