如何在Laravel项目中使用`bootstrap-datetimepicker`?

问题描述 投票:0回答:1

我有一个Laravel 5.6基地项目。我正在尝试使用Laravel Mix来编译我所有的js/css资源。

我想使用一个javascript datetime-picker,它允许我在我的页面上创建一个datetime-picke和一个范围选择器。由于我使用css-bootstrap框架进行样式化,我想使用bootstrap-datetimepicker。我很难用我的调音台设置来安装这个项目。

这是我的webpack.mix.js文件中的代码,

const { mix } = require('laravel-mix');

mix.js('resources/assets/js/app.js', 'public/js')
    .scripts([
            'bower_components/eonasdan-bootstrap-datetimepicker/build/js/tempusdominus-core.min.js'
        ], 'public/js/app_addons.js')
   .sass('resources/assets/sass/app.scss', 'public/css');

resources/assets/js/app.js文件中,我添加了以下代码

window.datetimepicker = require('../../../bower_components/eonasdan-bootstrap-datetimepicker/build/js/tempusdominus-core.min.js');

但是在浏览器的控制台中,我收到以下错误

TypeError:$(...)。datetimepicker不是函数

我怎样才能正确地将bootstrap-datetimepicker包含在我的laravel-mix中?

laravel laravel-5 bootstrap-datetimepicker laravel-mix eonasdan-datetimepicker
1个回答
0
投票

我认为这应该工作:

  1. 删除datetime-picker中关于webpack.mix.js的参考: const { mix } = require('laravel-mix'); mix.js('resources/assets/js/app.js', 'public/js') .sass('resources/assets/sass/app.scss', 'public/css');
  2. 将文件bower_components/eonasdan-bootstrap-datetimepicker/build/js/tempusdominus-core.min.js复制到resources/assets/js/tempusdominus-core.js
  3. 将此添加到app.jswindow.jQuery = window.$ = $ = require('jquery'); window.datetimepicker= require('./tempusdominus-core')($); //or require('./tempusdominus-core');

并希望能工作

© www.soinside.com 2019 - 2024. All rights reserved.