problem when running npm run watch

[FyllipeDavid]

You first need to do an npm install cross-env,
then in package.json change the following lines:
"watch": "cross-env NODE_ENV=development webpack --watch --config ./webpack/webpack.config.js",
"production": "cross-env NODE_ENV=production webpack --config ./webpack/webpack.config.js --display-entrypoints",

[Mr-El]

Thank you so much for this! But I can't find out how to make it build! It gives me errors!

[FyllipeDavid]

My English is not very good. As I understand it you want to know how to fix it? If so, I'll tell you how I did it.
1° npm install cross-env;
2° Add in package.json in watch and production:
watch": "cross-env NODE_ENV=development webpack --watch --config ./webpack/webpack.config.js",
"production": "cross-env NODE_ENV=production webpack --config ./webpack/webpack.config.js --display-entrypoints",

[Mr-El]

No not that sorry. What I have an issue with is npm run build. I cannot build it and update it to WordPress. When I try updating the files with my own changes, what happens is that the WordPress template won't show up anymore, it'll be blank. When I go to build it it says that the build script is missing. I tried making my own build script but to no avail. This repo is very important to a startup operation I'm in charge of. And this template is perfect for what I have in mind for my team of developers. So finding a fix is important to me. Thank you. I'm sorry about your poor English.

[FyllipeDavid]

Your script will work after adding npm install cross-env, and then adding cross-env before NODE_ENV, as I put in the example above.
watch": "cross-env NODE_ENV=development webpack --watch --config ./webpack/webpack.config.js",
"production": "cross-env NODE_ENV=production webpack --config ./webpack/webpack.config.js --display-entrypoints",
The main one is npm install cross-env

[Mr-El]

Yes. I'm saying that I did all of that. Added "production" and "watch" and did npm install cross-env. It still cannot build. I can successfully do npm run watch afterward but not npm run build.

[matamune94]

You first need to do an npm install cross-env,
then in package.json change the following lines:
"watch": "cross-env NODE_ENV=development webpack --watch --config ./webpack/webpack.config.js",
"production": "cross-env NODE_ENV=production webpack --config ./webpack/webpack.config.js --display-entrypoints",

Working good

[DrCashew]

Hi there. I cannot get it to work. I followed a bunch of tips&tricks, but to no avail. Maybe you guys can help me?

The logfile:

0 info it worked if it ends with ok
1 verbose cli [
1 verbose cli   'C:\\Program Files\\nodejs\\node.exe',
1 verbose cli   'C:\\Users\\31631\\AppData\\Roaming\\npm\\node_modules\\npm\\bin\\npm-cli.js',
1 verbose cli   'run',
1 verbose cli   'watch'
1 verbose cli ]
2 info using [email protected]
3 info using [email protected]
4 verbose run-script [ 'prewatch', 'watch', 'postwatch' ]
5 info lifecycle @~prewatch: @
6 info lifecycle @~watch: @
7 verbose lifecycle @~watch: unsafe-perm in lifecycle true
8 verbose lifecycle @~watch: PATH: C:\Users\31631\AppData\Roaming\npm\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin;E:\Websites\vue.doucemere.nl\vue.doucemere.nl\wp-content\themes\peregrine-falcon\node_modules\.bin;C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Windows\System32\OpenSSH\;C:\Program Files\nodejs\;C:\Program Files\Git\cmd;C:\Users\31631\AppData\Local\Microsoft\WindowsApps;C:\Users\31631\AppData\Local\atom\bin;C:\Users\31631\AppData\Roaming\npm;C:\Users\31631\AppData\Local\GitHubDesktop\bin
9 verbose lifecycle @~watch: CWD: E:\Websites\vue.doucemere.nl\vue.doucemere.nl\wp-content\themes\peregrine-falcon
10 silly lifecycle @~watch: Args: [
10 silly lifecycle   '/d /s /c',
10 silly lifecycle   'cross-env NODE_ENV=development webpack --watch --config ./webpack/webpack.config.js'
10 silly lifecycle ]
11 silly lifecycle @~watch: Returned: code: 1  signal: null
12 info lifecycle @~watch: Failed to exec watch script
13 verbose stack Error: @ watch: `cross-env NODE_ENV=development webpack --watch --config ./webpack/webpack.config.js`
13 verbose stack Exit status 1
13 verbose stack     at EventEmitter.<anonymous> (C:\Users\31631\AppData\Roaming\npm\node_modules\npm\node_modules\npm-lifecycle\index.js:332:16)
13 verbose stack     at EventEmitter.emit (events.js:315:20)
13 verbose stack     at ChildProcess.<anonymous> (C:\Users\31631\AppData\Roaming\npm\node_modules\npm\node_modules\npm-lifecycle\lib\spawn.js:55:14)
13 verbose stack     at ChildProcess.emit (events.js:315:20)
13 verbose stack     at maybeClose (internal/child_process.js:1048:16)
13 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:288:5)
14 verbose pkgid @
15 verbose cwd E:\Websites\vue.doucemere.nl\vue.doucemere.nl\wp-content\themes\peregrine-falcon
16 verbose Windows_NT 10.0.19041
17 verbose argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Users\\31631\\AppData\\Roaming\\npm\\node_modules\\npm\\bin\\npm-cli.js" "run" "watch"
18 verbose node v14.15.3
19 verbose npm  v6.14.10
20 error code ELIFECYCLE
21 error errno 1
22 error @ watch: `cross-env NODE_ENV=development webpack --watch --config ./webpack/webpack.config.js`
22 error Exit status 1
23 error Failed at the @ watch script.
23 error This is probably not a problem with npm. There is likely additional logging output above.
24 verbose exit [ 1, true ]

[christopheSeeka]

Hello, install cross-env and changed my package.json as follow:

  "scripts": {
    "watch": "cross-env NODE_ENV=development webpack --watch --config ./webpack/webpack.config.js",
    "production": "cross-env NODE_ENV=production webpack --config ./webpack/webpack.config.js --display-entrypoints",
    "rmdist": "rimraf dist"
  },

Getting:

TypeError: object null is not iterable (cannot read property Symbol(Symbol.iterator))

Any idea?

[markyoungdev]

Hello, install cross-env and changed my package.json as follow:

  "scripts": {
    "watch": "cross-env NODE_ENV=development webpack --watch --config ./webpack/webpack.config.js",
    "production": "cross-env NODE_ENV=production webpack --config ./webpack/webpack.config.js --display-entrypoints",
    "rmdist": "rimraf dist"
  },

Getting:

TypeError: object null is not iterable (cannot read property Symbol(Symbol.iterator))

Any idea?

Hi the answer was posted in another thread, here you go.

Working if i replace in webpack/loaders/files:

const [, themeName] = __dirname.match(/\/wp-content\/themes\/([^/]+)\/webpack\/loaders$/)

with

const themeName = __dirname.match(/\/wp-content\/themes\/([^/]+)\/webpack\/loaders$/)

[pavillator]

Babel loader uses babel core 7, make sure to update it, you can use: npm install @babel/core @babel/preset-env