Unable to use either laravel-mix or gulp examples

[rfay]

I tried out the laravel-mix and gulp examples, but I failed. I was using a plain vanilla laravel, with browser-sync and laravel-mix added.

In laravel-mix example with the suggested change I got

$ ddev . npm run watch

> watch
> mix watch

[webpack-cli] /var/www/html/webpack.mix.js:18
    .browserSync({
    ^

SyntaxError: Unexpected token '.'
    at Object.compileFunction (node:vm:352:18)
    at wrapSafe (node:internal/modules/cjs/loader:1033:15)
    at Module._compile (node:internal/modules/cjs/loader:1069:27)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at module.exports (/var/www/html/node_modules/laravel-mix/setup/webpack.config.js:11:5)
    at loadConfigByPath (/var/www/html/node_modules/webpack-cli/lib/webpack-cli.js:1747:27)
Failed to execute command npm run watch: exit status 2

With the gulp example, I got

$ ddev exec gulp
[15:40:23] Using gulpfile /var/www/html/gulpfile.js
[15:40:23] Task never defined: default
[15:40:23] To list available tasks, try running: gulp --tasks

A quick web search says the gulp issue might be gulp 4 vs gulp 3? https://stackoverflow.com/questions/42368150/gulp-default-task-never-defined-default-please-check-the-documentation-for-pr

I'm obviously a novice, would love to work this through with you on discord or in a screenshare call. Thanks!

[tyler36]

There seems to be problem with Gulp 3 & Node >=12.

[rfay]

The global gulp in ddev v1.19.2 is gulp 4, but the default node is 16 (but it's been 16 for some time).

• After setting ddev nvm use 12 I am able to get the laravel mix example with ddev . npm run watch to start. However, I don't seem to have to do that with browsersync-demo; and I note that has node 16
• It does look like the local gulp that gets installed with yarn install gulp is 4.0.2. But even with node 12, I still get

  $ ddev exec node --version && ddev exec gulp
  v12.22.12
  [02:44:27] Using gulpfile /var/www/html/gulpfile.js
  [02:44:27] Task never defined: default
  [02:44:27] To list available tasks, try running: gulp --tasks
  Failed to execute command gulp: exit status 1

Thanks for this fantastic initiative. Every time somebody asks about this they have to wander in the wilderness, and they'll be able to do better now!

BTW, we can just remove the switch the HTTP_EXPOSE like this and the 3000 will be http and we can just use the url that the program gives us:

      - HTTP_EXPOSE=${DDEV_ROUTER_HTTP_PORT}:80,${DDEV_MAILHOG_PORT}:8025,3000:3000
      - HTTPS_EXPOSE=${DDEV_ROUTER_HTTPS_PORT}:80,${DDEV_MAILHOG_HTTPS_PORT}:8025,3001:3000

[rfay]

And we can get rid of the need to add the DDEV_HOSTNAME like this in webpack.mix.js: let url = process.env.DDEV_HOSTNAME;

[rfay]

Wow, gulp 4.0.2 was published 3 years ago, and 3.9.1 6 years ago. I guess gulp isn't really a thing any more huh?

I guess gulp 3 is broken on node 12, https://github.com/gulpjs/gulp/issues/2324 and https://stackoverflow.com/questions/55921442/how-to-fix-referenceerror-primordials-is-not-defined-in-node-js

Based on https://stackoverflow.com/questions/55921442/how-to-fix-referenceerror-primordials-is-not-defined-in-node-js though, gulp is long dead and it's not even worth messing with.

[tyler36]

Based on that, I'm removing the gulp example. (b4f1f4e265f72430beff283d1e2d557d8c7e92a6)

[tyler36]

And we can get rid of the need to add the DDEV_HOSTNAME like this in webpack.mix.js:

Fixed in #7