前端技术 手机教程
程序开发 平面动画
系统软件 运营推广
CMS教程 在线手册
资源下载 网络安全
精准搜索请尝试:精确搜索

Laravel mix怎么引用npm下载的插件?

2019-11-28 15:37:29 来源:原创 作者:寂静的神经

Laravel Mix 提供了定义 Webpack 构建步骤的 API,用于在应用中使用常见的 CSS 和 JavaScript 预处理器。通过链式调用这些简洁方法,可以流畅地定义资源管道。

但是官方手册却没有详细的说明我们通过npm下载的插件包,要怎么通过Webpack打包到应用的CSS和JavaScript中,下面介绍一下具体流程,以安装bootstrap-fileinput为例:

1.首先我们运行mix监听资源变化


npm run watch

2.通过npm安装bootstrap-fileinput:


npm install bootstrap-fileinput

执行命令后,bootstrap-fileinput会被下载到项目的node_modules文件夹中

3.引入bootstrap-fileinput.js

我们打开resources/js/app.js,加入以下代码:


require('bootstrap-fileinput')

4.引入bootstrap-fileinput.css

我们打开resources/sass/app.sass,加入以下代码:


@import '~bootstrap-fileinput/scss/fileinput';

到此我们就完成了Laravel mix引用npm下载的插件,刷新前台页面后就会发现app.js和app.css中已经编译包含了bootstrap-fileinput的js和css文件。

 

分享到:
本文关键词:laravel mix npm

相关文章

零五科技,分享IT知识,国内顶级IT知识门户网站。

Copyright (C) www.02405.com, All Rights Reserved.

零五科技 版权所有 辽ICP备13002105号-1