#typescript #webpack #vue-cli #vue-cli-3
#typescript #webpack #vue-cli #vue-cli-3
Вопрос:
DevOps потребовала, чтобы мы ограничили объем оперативной памяти для наших интерфейсных сборок ~ 1 ГБ, чтобы наш экземпляр Jenkins не завершал работу. Мы используем стандартный @vue/cli
проект с TypeScript. Однако служба проверки типов TS игнорирует все попытки ограничить использование ее памяти, которая всегда составляет 2048 МБ.
Я пытался отключить ее и полагаться на fork-ts-checker-webpack-plugin
, но это создает другие проблемы.
Основываясь на том, что я нашел, это должно сработать:
$ NODE_OPTIONS=--max_old_space_size=1024
NODE_ENV=production
node
--max_old_space_size=1024
--max-old-space-size=1024
node_modules/.bin/vue-cli-service build
Обратите внимание, что я понятия не имею, как работают эти ограничения памяти, поскольку у меня ограниченная осведомленность о внутренних компонентах узла. Но, несмотря на это, служба проверки типов всегда запускается с ограничением в 2048 МБ.
Я не уверен, что это проблема, связанная с тем, как Vue CLI настраивает Webpack / TS.
Ответ №1:
Я столкнулся с той же проблемой (хотя в моем случае я хотел увеличить ограничение памяти, а не снизить его). Я смог изменить конфигурацию ForkTsCheckerWebpackPlugin
, настроив встроенный Vue CLI webpack.config
:
// in vue.config.js
const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
module.exports = {
configureWebpack: config => {
// get a reference to the existing ForkTsCheckerWebpackPlugin
const existingForkTsChecker = config.plugins.filter(
p => p instanceof ForkTsCheckerWebpackPlugin,
)[0];
// remove the existing ForkTsCheckerWebpackPlugin
// so that we can replace it with our modified version
config.plugins = config.plugins.filter(
p => !(p instanceof ForkTsCheckerWebpackPlugin),
);
// copy the options from the original ForkTsCheckerWebpackPlugin
// instance and add the memoryLimit property
const forkTsCheckerOptions = existingForkTsChecker.options;
forkTsCheckerOptions.memoryLimit = 8192;
config.plugins.push(new ForkTsCheckerWebpackPlugin(forkTsCheckerOptions));
},
};
Теперь, когда я запускаю свою сборку, я вижу это в своих выходных данных:
- Building for production...
Starting type checking service...
Using 1 worker with 8192MB memory limit
Больше информации об этой configureWebpack
опции здесь: https://cli.vuejs.org/config/#configurewebpack
Чтобы увидеть конфигурацию Webpack по умолчанию, используемую Vue CLI, вы можете проверить ее, выполнив vue inspect
:https://cli.vuejs.org/guide/webpack.html#inspecting-the-project-s-webpack-config
Комментарии:
1. Спасибо за совет. Я больше не работаю в том же месте, поэтому я не могу проверить, является ли ваше решение правильным, но похоже, что это так!
2. Я попробовал 2 и 4 рабочих вместо 1, а также 8 ГБ памяти вместо 2 ГБ по умолчанию. Заметной разницы нет. Есть ли объяснение этому? Похоже, это предложение имеет довольно эзотерический эффект…
Ответ №2:
в vue.config.js
const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
const os=require('os');
module.exports = {
//......,
chainWebpack: config => {
config
.plugin('fork-ts-checker')
.tap(args => {
let totalmem=Math.floor(os.totalmem()/1024/1024); //get OS mem size
let allowUseMem= totalmem>2500? 2048:1000;
// in vue-cli shuld args[0]['typescript'].memoryLimit
args[0].memoryLimit = allowUseMem;
return args
})
},
//......
}
Комментарии:
1. Это решение сработало для меня. Просто для ясности, этому фрагменту кода в моем проекте предшествовал
configureWebpack{},
Ответ №3:
в node_modules/fork-ts-checker-webpack-plugin/lib/index.js
declare class ForkTsCheckerWebpackPlugin {
static readonly DEFAULT_MEMORY_LIMIT = 4096;
static readonly ONE_CPU = 1;
static readonly ALL_CPUS: number;
static readonly ONE_CPU_FREE: number;
static readonly TWO_CPUS_FREE: number;
readonly options: Partial<Options>;
Комментарии:
1. Не согласен. Одно обновление npm — которое должно выполняться регулярно — и эта конфигурация исчезла или ее нужно запомнить, чтобы переделать