所以我正在使用Laravel 5.4,我使用webpack在1个大的js文件中编译多个.js文件。
const { mix } = require('laravel-mix');
// Compile all CSS file from the theme
mix.styles([
'resources/assets/theme/css/bootstrap.min.css',
'resources/assets/theme/css/main.css',
'resources/assets/theme/css/plugins.css',
'resources/assets/theme/css/themes.css',
'resources/assets/theme/css/themes/emerald.css',
'resources/assets/theme/css/font-awesome.min.css',
], 'public/css/theme.css');
// Compile all JS file from the theme
mix.scripts([
'resources/assets/theme/js/bootstrap.min.js',
'resources/assets/theme/js/app.js',
'resources/assets/theme/js/modernizr.js',
'resources/assets/theme/js/plugins.js',
], 'public/js/theme.js');
这是我这样做webpack.mix.js
(css 也是如此(。但我想得到这样的东西:resources/assets/theme/js/*
从文件夹中获取所有文件。因此,当我在文件夹中创建一个新的js文件时,webpack会自动找到它,并在运行命令时对其进行编译。
有人知道怎么做吗?
感谢您的帮助。
如果有人希望代码将目录中的所有 sass/less/js 文件编译到具有相同文件名的不同目录,您可以使用以下命令:
// webpack.mix.js
let fs = require('fs');
let getFiles = function (dir) {
// get all 'files' in this directory
// filter directories
return fs.readdirSync(dir).filter(file => {
return fs.statSync(`${dir}/${file}`).isFile();
});
};
getFiles('directory').forEach(function (filepath) {
mix.js('directory/' + filepath, 'js');
});
通配符实际上允许使用 mix.scripts()
方法,正如本期创建者所确认的那样。因此,您的呼叫应如下所示:
mix.scripts(
'resources/assets/theme/js/*.js',
'public/js/theme.js');
我认为它对样式的工作方式相同,因为它们使用相同的方法来组合文件。
希望这对你有帮助。