Не могу скомпилировать активы с Gulp - PullRequest
Новая
       41

Не могу скомпилировать активы с Gulp

1 голос
/ 08 мая 2019

Каждый учебник или документ, который я нахожу, говорит, что я должен сделать что-то вроде этого: 

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 глобальный.

Что мне не хватает?

1 Ответ

1 голос
/ 10 мая 2019

Эта проблема возникает из-за проблемы с версией gulp 4 имеет другую подпись для task, а laravel-elixir использует старую подпись gulp 3, поэтому она вызовет ошибку.

Лучше всего было бы переместить https://laravel -mix.com , так как он основан на webpack, поэтому он поддерживает больше функций. также синтаксис laravel-mix аналогичен, поэтому его плюс.

Для laravel-mix создайте этот файл pacjage package.json в корневом каталоге. или последний пользователь из [https://github.com/laravel/laravel] публичного репо. 

{
    "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 в корне 

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');

Команды [вы можете использовать эту команду с yarn или npm (я использую yarn)], вы можете прочитать больше информации здесь. [https://laravel -mix.com / docs / 4.0 / workflow ]

yarn watch -> он будет смотреть файлы и компилировать файлы, а затем генерировать скомпилированный вывод в каталог publicPath. в нашем случае файлы будут. 

themes/rainlab-bonjour/assets/compiled/main.js
themes/rainlab-bonjour/assets/compiled/main.css

Теперь вы можете просто включить их в тему, используя 'assets/compiled/main.js'|theme фильтр OctoberCms.

если у вас есть какие-либо сомнения, пожалуйста, прокомментируйте.

...