Laravel 5.8如何包含node_modules

Question

我需要将tempusdominus datetimepicker包含到我的Laravel 5.8项目中，但我无法正确加载scipts和样式。

根据文档，我试图将这几行添加到我的bootstrap.js.

try {
window.$ = window.jQuery = require('jquery');
mix.copy('node_modules/tempusdominus-bootstrap-4/build/css/tempusdominus-bootstrap-4.min.css', 'public/css/tempusdominus.css');
require('bootstrap');
require('moment');
require('tempusdominus-bootstrap-4');
require('./main.js');
} catch (e) {}

Watcher说所有东西都编译成功了，但控制台向我抛出了一个错误$(…(。datetimepicker不是一个函数，我在公共目录中没有看到任何tempusdominus css。

带有$((.datetimepicker的脚本通过这种方式包含在文件末尾的部分中。

@section('scripts')
<script type="text/javascript">
$(function () {
$('#datetimepicker1').datetimepicker({
locale: 'sk'
});
$('#datetimepicker2').datetimepicker({
locale: 'sk'
});
});
</script>
@endsection

我做错了什么？

Answer 1

首先，使用NPM安装Bootstrap 4和Tempus Dominus包。

npm i bootstrap
npm i tempusdominus/bootstrap-4

您应该在package.json文件中看到"tempusdominus-bootstrap-4@5.1.2"。

将其添加到您的app.js文件中：

try {
window.Popper = require('popper.js').default;
window.$ = window.jQuery = require('jquery');
window.TempusDominusBootstrap4 = require('tempusdominus-bootstrap-4');
require('bootstrap');
} catch (e) {}

然后对于CSS，将其添加到您的应用程序中。CSS：

// Bootstrap
@import '~bootstrap/scss/bootstrap';
@import '~tempusdominus-bootstrap-4/src/sass/tempusdominus-bootstrap-4';

然后编译您的资产：

npm run prod

你现在应该做生意了，但不要忘记JS中的某个地方。。。

$('#datetimepicker').datetimepicker(FUNCTION)