首页 > 解决方案 > Uncaught TypeError: r is not a function at index.js:1

问题描述

虚拟专用服务器上的 Laravel 项目。构建后,npm run production我通过 Chrome 打开页面,只看到空白页面。控制台向我显示了这个错误。我试图在 webpack.mix.js 中添加一些插件,比如“babel-polyfill”,但没有结果。Laravel 框架 5.4.36 npm 版本 3.10.10

这是我的 app.blade.php

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta
            name="viewport"
            content="width=device-width, initial-scale=1, user-scalable=0, maximum-scale=1, minimum-scale=1"
    >

    <!-- CSRF Token -->
    <meta name="csrf-token" content="{{ csrf_token() }}">

    <title>{{ config('app.name', 'Laravel') }}</title>

    <!-- Styles -->
    <link rel="stylesheet" href="{{ elixir('css/app.css') }}">

    <!-- Scripts -->
    <script>
        window.Laravel = <?php echo json_encode([
                'csrfToken' => csrf_token(),
        ]); ?>
    </script>
</head>
<body>

<div id="react-container"></div>

<!-- Scripts -->
<script>
    var MapInstance;
</script>

<script src="{{ mix('js/app/manifest.js') }}"></script>
<script src="{{ mix('js/app/vendor.js') }}"></script>
<script src="{{ mix('js/app/index.js') }}"></script>

</body>
</html>

和我的 webpack.mix.js

let mix = require('laravel-mix');


mix
  .react('resources/assets/js/app/index.jsx', 'public/js/app')
   
  .sass('resources/assets/sass/app.scss', 'public/css')
  .sass('resources/assets/sass/start.scss', 'public/css')
  .copy('node_modules/material-design-lite/material.min.js', 'public/vendor/material.min.js')
  .copy('node_modules/material-design-lite/material.min.js.map', 'public/vendor/material.min.js.map')
  .copy('node_modules/jquery/dist/jquery.min.js', 'public/vendor/jquery.min.js')
  .sourceMaps()
  .browserSync('ap.dev');

if (mix.inProduction()) {
  mix.version();
}

标签: javascripthtmllaravel

解决方案


您必须在 Material in 之前添加 JQuery webpack.mix.js

// ...

.copy(
    'node_modules/jquery/dist/jquery.min.js', 
    'public/vendor/jquery.min.js'
)
.copy(
    'node_modules/material-design-lite/material.min.js',
    'public/vendor/material.min.js'
)
.copy(
    'node_modules/material-design-lite/material.min.js.map',
    'public/vendor/material.min.js.map'
)

推荐阅读