Laravel，将javascript导入刀片模板的正确方法
我使用的是Laravel 5.6。This page对我不起作用。
pizza/index.blade.php看起来像这样：
@extends('layouts.app')
@section('content')
<!-- Styles -->
<link href="{{ asset('css/pizza.css') }}" rel="stylesheet">
<!-- Scripts -->
<script src="{{ asset('js/components/pizza.js')}}"></script>
<div class="container">
<div class="row justify-content-center">
<div class="card">
<div class="card-header">Pizza</div>
<div class="card-body">
<form action="/pizzas" method="post">
@if ($errors->any())
<div class="alert alert-danger" role="alert">
Please fix the following errors
</div>
@endif
@include('pizza.table')
</form>
</div>
</div>
</div>
</div>
@endsection披萨/table.blade.php：
<div class="pizza-selection">
<b>Thanks god its pizza day! Select your pizza of the day!</b>
<table id="pizzas" class="md-box">
<tr>
...
</tr>
@foreach ($pizzas as $pizza)
...
@endforeach
<tr>
...
<input type="button" class="md-box btn btn-default"
id="add_new_pizza" onClick="addPizza()" value="Add Pizza!">
</td>
</tr>
</table>
...当我点击"add_new_pizza“按钮时，我得到了一个引用错误，onClick=" addPizza() "，addPizza()没有定义。但是，我尝试在index.blade.php中导入pizza.js
<script src="{{ asset('js/components/pizza.js')}}"></script>打印出asset('js/components/pizza.js')返回http://localhost:8080/js/components/pizza.js，这在我看来是正确的。
public/js/components/pizza.js如下所示：
import PizzaService from '../services/PizzaService.js';
async function addPizza(){
// some functionality
}当我在.blade.php的脚本中使用addPizza()函数时，它也可以工作。
此外，如果您需要进一步的代码审查，请在GitHub上找到存储库：https://github.com/andrelandgraf/laravel-docker
编辑:当我在<script><script>中复制pizza.js时，它工作得很好，但我收到了一个SyntaxError：import declarations may only appear at top level of a module。当我通过src导入脚本时，这个SyntaxError消失了，就像你在我的代码示例中看到的那样。对我来说，这表明脚本根本没有加载。
EDIT2和解决方案:我使用了@kerbholz解决方案。我在app.blade.php中将@stack('scripts')添加到body的底部，并在index.blade.php的@section('content')中添加了I know @push('stack') pizza.js文件。
我现在又前进了一步，但我仍然收到编辑中声明的SyntaxError。有没有办法解决这个问题，或者我只需要删除PizzaService.js的导入并为这个文件添加一个<scipt>-Tag？
EDIT3:好的，这个问题是不相关的。看起来浏览器还不支持ES6模块。
https://stackoverflow.com/questions/51592054
复制相似问题