Question

只是最近才跳到了Laravel和Bootstrap 4带上，唉我已经使用Bootstrap 4.0运行Laravel 5.5没问题了。 Sooo，我有getbootstrap.com仪表板主题，但我不清楚如何编译主题资产和依赖，即我如何处理gulpfile.js和package.json？

注意：我使用的是Laravel 5.5.34和Bootstrap 4.0.0。我宁愿学习如何使用Laravel Mix编译资源并从Gulp迁移到Webpack，而不是简单地将dist CSS复制到公共目录或链接到刀片模板中的CDN。

Answer 1

我经历了同样的困境，Jeffrey Way的this answer帮助了我。

我在resources / assets文件夹中创建了一个css文件夹（现在它看起来像resources / assets / css）。我将主题附带的所有css文件复制到此文件夹中。

我更新了应用程序根目录中的webpack.mix.js文件

mix.js('resources/assets/js/app.js', 'public/js')
mix.styles([
      'resources/assets/css/app.min.css',
      'resources/assets/css/primary.css',
      'resources/assets/css/style.css'
  ], 'public/css/app.css');

现在当我运行npm run dev时，所有的css都被编译成pubilc / css / app.css中的单个文件和js的public / js / app.js

注意：我的主题还附带了一个名为app.min.js

的js文件

所以我在public / js / app.min.js中将它包含在内，因为主要的编译文件名是app.js.如果您的主题有一个文件app.js将其重命名为theme.js并放在public / js文件夹中。

使用{{asset（'css / app.css'）}}

编译后，您可以按照常规方式调用这些方法。

在Laravel 5.5中使用Bootstrap 4主题

1 个答案: