Deleted jquery still shows on the top of DOM before HTML (jquery link is defined in head section though), thus
ReferenceError: $ is not defined
每次加载页面时,自定义js都会在DOM顶部显示,甚至在html标记之前。
参考错误:未定义$显示
我已经从webpack.mix.js中删除了自定义js文件
每次加载页面时,即使在html标记之前,旧的已删除的jquery仍显示在DOM的顶部
参考错误:未定义$显示
p.s:运行php artsan serve和npm运行dev并从.storage / framework / views中删除先前的视图文件
app.js
require('./bootstrap');
window.Vue = require('vue');
Vue.component('example-component', require('./components/ExampleComponent.vue').default);
const app = new Vue({
el: '#app',
});
webpack.mix.js
mix.js('resources/js/app.js', 'public/js')
.sass('resources/sass/app.scss', 'public/css');
DOM
<script type="text/javascript">
$(document).ready(function() {
$(".btn-success").click(function(){
var html = $(".clone").html();
$(".increment").after(html);
});
$("body").on("click",".btn-danger",function(){
$(this).parents(".control-group").remove();
});
});
</script>
<!DOCTYPE html>
<html lang="en">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- CSRF Token -->
<meta name="csrf-token" content="JK6i5Dru1PRn5ubunzRnXUcaocEyPMXauiV5QtYE">
<title>Laravel</title>
<!-- Scripts -->
<script src="http://localhost:8005/js/app.js" defer></script>
<!-- Fonts -->
<link rel="dns-prefetch" href="//fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css?family=Nunito" rel="stylesheet" type="text/css">
<!-- Styles -->
<link href="http://localhost:8005/css/app.css" rel="stylesheet">
</head>
<body>
<div id="app">
<nav class="navbar navbar-expand-md navbar-light bg-white shadow-sm">
<div class="container">
<a class="navbar-brand" href="http://localhost:8005">
Laravel
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<!-- Left Side Of Navbar -->
<ul class="navbar-nav mr-auto">
</ul>
<!-- Right Side Of Navbar -->
<ul class="navbar-nav ml-auto">
<!-- Authentication Links -->
<li class="nav-item">
<a class="nav-link" href="http://localhost:8005/login">Login</a>
</li>
<li class="nav-item">
<a class="nav-link" href="http://localhost:8005/register">Register</a>
</li>
</ul>
</div>
</div>
</nav>
<main class="py-4">
<div class="container">
<div class="row">
<div class="col">
<form method="POST" action="http://localhost:8005/company" accept-charset="UTF-8"><input name="_token" type="hidden" value="JK6i5Dru1PRn5ubunzRnXUcaocEyPMXauiV5QtYE">
<div class="form-group">
<label for="name" class="control-label">Company Name</label>
<input class="form-control input-lg" placeholder="company name" name="name" type="text" id="name">
</div>
<div class="form-group">
<label for="email" class="control-label">Company Email</label>
<input class="form-control input-lg" placeholder="company email" name="email" type="text" id="email">
</div>
<div class="form-group">
<label for="website" class="control-label">Company website</label>
<input class="form-control input-lg" placeholder="company website" name="website" type="text" id="website">
</div>
<h3 class="jumbotron">Laravel Multiple File upload</h3>
<div class="input-group control-group increment">
<input type="file" name="filename[]" class="form-control">
<div class="input-group-btn">
<button class="btn btn-success" type="button">
<i class="glyphicon glyphicon-plus">Add</i>
</button>
</div>
</div>
<br>
<div class="clone hide">
<div class="control-group input-group">
<input type="file" name="filename[]" class="form-control">
<div class="input-group-btn">
<button class="btn btn-danger" type="button"><i class="glyphicon glyphicon-remove"></i>Remove</button>
</div>
</div>
</div>
<div class="form-group">
<input class="btn btn-info btn-lg" style="width:100%" type="submit" value="Add Company">
</div>
</form>
</div>
</div>
</div>
</main>
</div>
</body>
</html>