我发现的每个教程或文档都说我应该做这样的事情:
var elixir = require('laravel-elixir');
elixir.config.assetsPath = 'themes/ei/assets/src';
elixir.config.publicPath = 'themes/ei/assets/'
elixir(function(mix) {
mix.sass('style.scss');
mix.scripts('main.js');
});
但是当我从命令行运行gulp
时,我得到了:
AssertionError [ERR_ASSERTION]: Task function must be specified
at Gulp.set [as _setTask] (/home/andrew/Development/eiweb/node_modules/undertaker/lib/set-task.js:10:3)
at Gulp.task (/home/andrew/Development/eiweb/node_modules/undertaker/lib/task.js:13:8)
at Object.<anonymous> (/home/andrew/Development/eiweb/node_modules/laravel-elixir/dist/tasks/recipes/default.js:30:6)
at Module._compile (internal/modules/cjs/loader.js:816:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:827:10)
at Module.load (internal/modules/cjs/loader.js:685:32)
at Function.Module._load (internal/modules/cjs/loader.js:620:12)
at Module.require (internal/modules/cjs/loader.js:723:19)
at require (internal/modules/cjs/helpers.js:14:16)
at requireDir (/home/andrew/Development/eiweb/node_modules/require-dir/index.js:123:33)
我的package.json
文件包括:
"dependencies": {
"gulp": "^4.0.2",
"laravel-elixir": "^6.0.0-18"
}
...并且我已经全局安装了gulp-cli
。
我想念什么?
答案 0 :(得分:0)
发生此问题是由于版本问题gulp 4
的{{1}}具有不同的签名,而task
使用的是laravel-elixir
的旧签名,因此会导致错误。
最好的情况是将移动 https://laravel-mix.com作为gulp 3
的基础,以便它支持更多功能。 webpack
的语法也很相似,因此它的优点是。
对于laravel-mix ,请在根目录中创建此pacjage
laravel-mix
文件。或来自[{https://github.com/laravel/laravel]公共仓库的最新用户。
package.json
在您的根目录中创建
{ "private": true, "scripts": { "dev": "npm run development", "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js", "watch": "npm run development -- --watch", "watch-poll": "npm run watch -- --watch-poll", "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js", "prod": "npm run production", "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js" }, "devDependencies": { "axios": "^0.18", "bootstrap": "^4.1.0", "cross-env": "^5.1", "jquery": "^3.2", "laravel-mix": "^4.0.7", "lodash": "^4.17.5", "popper.js": "^1.12", "resolve-url-loader": "^2.3.1", "sass": "^1.15.2", "sass-loader": "^7.1.0", "vue": "^2.5.17", "vue-template-compiler": "^2.6.10" } }
webpack.mix.js
命令[您可以将此命令与yarn或npm一起使用(我正在使用yarn)],您可以在此处阅读更多信息。 [https://laravel-mix.com/docs/4.0/workflow]
纱线监视->它将监视文件并编译文件,然后在
const mix = require('laravel-mix'); // change theme path according to your need. const themePath = 'themes/rainlab-bonjour'; mix.options({ publicPath: themePath + '/assets/compiled/' }) // change script name and path according to your need. mix.js(themePath + '/assets/src/main.js', 'main.js') .sass(themePath + '/assets/src/main.scss', 'main.css');
目录中生成已编译的输出。在我们的情况下,文件将是。
publicPath
现在,您可以使用
themes/rainlab-bonjour/assets/compiled/main.js themes/rainlab-bonjour/assets/compiled/main.css
OctoberCms过滤器将它们包括在主题中。
如有任何疑问,请发表评论。