Почему возникает ошибка при использовании переменной окружения в конфиге webpack?

Question

[johnymkp]

Пытаюсь при запуске скрипта передать значения в конфиг вебпака, но работает как-то странно. Когда скрипт такой:

"scripts": {
    "build": "webpack"
}

То запуск с единственной переменной окружения, например вот так: npm run build --env mode=development выдает ошибку: [webpack-cli] Unknown command or entry 'mode=development'

Если поправить скрипт вот так:

"scripts": {
    "build": "webpack --env mode=production"
}

и запустить npm run build --env mode=development, то работает нормально и в конфиг попадает правильное значение. Т.е. в данном случае попадет development, а не production.

Файл самого конфига (там внутри кстати тоже есть вопрос про console):

тык

const path = require('path');

module.exports = (settings) => {
  console.log("Hello, world!");  // Работает, выводит в виндовую консоль сообщение.
  // сonsole.log(settings.mode);  // Вызывает ошибку "ReferenceError: сonsole is not defined"

  return {
    mode: settings.mode,  // Получает правильное значение
    entry: './src/index.js',
    output: {
      filename: 'main.js',
      path: path.resolve(__dirname, 'dist'),
      clean: true
    }
  }
};

Сначала я подумал, что нельзя передавать произвольные переменные, что надо их все описать в самом скрипте со значениями по умолчанию. Но если такой скрипт

"scripts": {
    "build": "webpack --env mode=production"
}

вызвать вот так

npm run build --env mode=development --env foobar=gost

или так npm run build --env foobar=gost то переменную foobar я могу прочитать и ошибок не возникает. Т.е. получается, что все-таки можно передавать произвольные переменные. Но почему это не работает, когда переменная всего одна? И почему консоль работает так странно - обычная строка выводится, а вот значение переменной вызывает ошибку ReferenceError: сonsole is not defined?

Comments

[Aetae]

Сделай самый минимальный и поделись им. У тебя какая-то ересь происходит.

[johnymkp]

Aetae,

webpack.config.js

const path = require('path');

module.exports = (settings) => {
  console.log("Hello, world!");
  сonsole.log(settings.mode);

  return {
    mode: settings.mode,
    entry: './src/index.js',
    output: {
      filename: 'main.js',
      path: path.resolve(__dirname, 'dist'),
      clean: true
    }
  }
};

package.json

{
  "name": "mywebpack",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "build": "webpack"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "webpack": "^5.93.0",
    "webpack-cli": "^5.1.4"
  }
}

Команда запуска npm run build --env mode=production
Ошибка:

[webpack-cli] Unknown command or entry 'mode=production'
[webpack-cli] 
Run 'webpack --help' to see available commands and options

P.S. Есть подозрение, что если в package.json в скрипте не указать хотя бы одну переменную, например `"build": "webpack --env ololo=nomatter"`, то при запуске скрипта, например `npm run build --env some=thing" объект env вообще не создается, даже если передавать переменные. А если в скрипте хотя бы одна переменная описана, тогда env создается, и в него накидывается все, что мы передаем при запуске.

Answer 1

[Aetae]

Потестил.
1. Проблема с conslole.log у тебя в русской "c", о чём намекает даже подсветка тут.
2. npm run съедает параметр --env, т.к. считает его своим, чтоб передавать аргументы в скрипт надо использовать разделитель --: npm run build -- --env mode=development.
Ну или выкинуть убогий npm и использвать yarn\pnpm, где такой ереси нет.:)

Comments

[johnymkp]

Спасибо, в самом деле с -- начало работать.