Laravel 5.4 在哪里写 javascript 代码？

Question

我真的很抱歉提出一个绝对愚蠢的问题，但我不明白我应该在 Laravel 5.4 中的什么地方编写 js 代码。我的站点将由两部分组成，一部分供用户 app 使用，另一部分供管理员使用 dashboard，每个部分都有自己的 js 和 css 文件，所以这是我的 webpack.mix.js

mix.js('resources/assets/js/app.js', 'public/js/app.js')
   .js('resources/assets/js/dashboard.js', 'public/js/dashboard.js')
   .sass('resources/assets/sass/app.scss', 'public/css/dashboard.css')
   .less('resources/assets/less/app.less', 'public/css/app.css');

文件
resources/assets/js/dashboard.js

require('./bootstrap');
Vue.component('example', require('./components/Example.vue'));

const app = new Vue({
    el: '#app'
});

resources/assets/js/app.js

require('./bootstrap');
Vue.component('example', require('./components/Example.vue'));

const app = new Vue({
    el: '#app'
});

我在哪里编写自己的代码？

Answer 1

您应该创建 2 个文件，例如： admin.js 和 front.js。比在 public/js 目录中将其编译为单独的 js 文件：

mix.webpack('resources/assets/js/admin.js', 'public/js/admin.js')
.webpack('resources/assets/js/front.js', 'public/js/front.js')

并在布局中单独使用它。

在您的 admin.js 文件示例中：

window.jQuery = window.$ = require('./jquery-3.1.1.js');
require('./bootstrap');
require('./bootstrap-tagsinput');
require('./bootstrap-progressbar');
require('./custom.js');
require('./jquery.nestable.js');
require('./canvas-to-blob');
require('./purify');
require('./bordercoloranimate');
window.sweetAlert = require('./sweetalert.min.js');

Answer 2

您的 resources/assets/js/ 文件夹中的 app.js 或 dashboard.js 文件是普通的 JS 文件。所以你可以直接在那里添加你的代码，例如：

dashboard.js

require('./bootstrap');
Vue.component('example', require('./components/Example.vue'));

const app = new Vue({
    el: '#app'
});

$(document).ready(function() {
    ///Your code here
});

但不要忘记将 public 文件夹中的 js 文件包含到 HTML 文件中。

如果您不想在您的项目中使用 VueJS，您可以将其完全删除。

dashboard.js

require('./bootstrap');

$(document).ready(function() {
    ///Your code here
});

Laravel 5.4 在哪里写 javascript 代码？

Laravel 5.4 where to write javascript code?

javascript

laravel

laravel-5.4