Laravel 5.8 如何包含 node_modules答案

【问题标题】：Laravel 5.8 how to include node_modulesLaravel 5.8 如何包含 node_modules
【发布时间】：2020-07-21 06:52:36
【问题描述】：

我需要在我的 Laravel 5.8 项目中包含 tempusdominus datetimepicker，但我无法正确加载 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 is not a function，我在公共目录中看不到任何 tempusdominus css。

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

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

我做错了什么？

【问题讨论】：

你有一个错字“ode_modules”
是的，但这不是原因。我修好了。
尝试像require(["bootstrap","moment","tempusdominus-bootstrap-4"], function(){ require('./main.js'); })一样将模块包装在require中
为什么？ Jquery 和 main.js 已正确加载。有什么区别？
还是一样。

标签： laravel laravel-5 node-modules laravel-5.8

【解决方案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 将其添加到您的 app.scss:

// Bootstrap
@import '~bootstrap/scss/bootstrap';

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

然后编译你的资产：

npm run prod

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

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

【讨论】：