laravel - 如何在 vue js 和 laravel 中使用外部脚本
问题描述
是我第一次使用vue js和laravel混合,我有点困惑,我以前手动加载脚本,没有编译,但是现在我想使用vue js,当我将app.js脚本添加到最后我的刀片模板的其他脚本停止工作,我尝试编译所有脚本并将它们与 app.js 文件一起添加,但即使这样它也不起作用,这是我的 webpack 代码
mix.js('resources/assets/js/app.js', 'public/js')
.sass('resources/assets/sass/app.scss', 'public/css');
//project files
mix.styles([
'public/css/materialize.css',
'public/plugins/datatablesMaterialize.css',
'public/css/main.css',
'public/css/ionicons.min.css',
'public/css/nouislider.css',
'public/plugins/fullcalendar/fullcalendar.css',
'public/plugins/responsive.dataTables.min.css',
'public/css/jquery.fancybox.min.css',
'public/css/style.css',
'public/css/sweetalert2.min.css',
'public/css/jquery.steps.css'
], 'public/css/allPets.css');
mix.scripts([
'public/plugins/datatablesMaterialize.js',
'public/plugins/moment.min.js',
'public/plugins/dataTables.responsive.min.js',
'public/plugins/moment.min.js',
'public/plugins/fullcalendar/fullcalendar.js',
'public/plugins/fullcalendar/lang/es.js',
'public/plugins/jquery.validate.js',
'public/plugins/validation-additional-methods.min.js',
'public/js/materialize.js',
'public/js/sweetalert2.min.js',
'public/js/jquery.steps.js',
'public/plugins/jquery.validate.js',
'public/plugins/slick/slick.min.js',
'public/js/jquery.fancybox.min.js',
'public/js/spinner.js',
'public/js/jquery.spin.js',
'public/js/funciones.js'
], 'public/js/allPets.js');
当我在没有脚本 app.js 的情况下使用文件 allPets.css 和 allPets.js 时,一切正常,但是当我添加所有内容时,它再次停止工作(materialize 的侧边栏停止工作等)。
解决方案
var plugin = 'resources/assets/plugins/';
mix.js('resources/assets/js/app.js', 'public/js/app.js')
.combine([
plugin + 'jquery/jquery.min.js',
plugin + 'popper/popper.min.js',
plugin + 'bootstrap/bootstrap.min.js',
plugin + 'moment/moment.min.js',
plugin + 'toastr/toastr.min.js',
plugin + 'slimscroll/jquery.slimscroll.js',
plugin + 'waves/waves.js',
plugin + 'sticky-kit/sticky-kit.min.js',
plugin + 'fancybox/jquery.fancybox.pack.js',
plugin + 'fancybox/jquery.fancybox.js',
plugin + 'fancybox/jquery.mousewheel.pack.js',
'public/js/app.js',
],'public/js/bundle.min.js')
.sass('resources/assets/sass/style.scss', 'public/css')
.browserSync('laravue');
推荐阅读
- java - 在 Java 控制台中打印一行('\n' 的反面)
- c# - 使用 REST 的客户端证书问题
- android - 将数据从一个列表视图传递到另一个文本视图
- c# - 首先从 EF6 数据库中的 DbSet 获取外键字段
- android - ProgressBar 的进度在旋转或调整大小时显示错误
- wordpress - WordPress - 通过元数据获取评论?
- c++ - QSerialPort 中实际写入设备的字节数
- zsh - 当 Oh-my-ZSH 插件无法访问外部应用程序时如何隐藏终端警告
- css - Android 平板电脑和 Windows XP 上的 Chrome 打印预览减半
- c# - 将 VFP WRITETEXT/READTEXT 转换为字节 []?