В Laravel Mix конфигурация по умолчанию использует порт 8080 для запуска сервера разработки. Однако могут быть случаи, когда вам потребуется изменить порт в соответствии с конкретными требованиями. В этой статье мы рассмотрим несколько способов изменения порта Laravel Mix и предоставим примеры кода для каждого подхода.

Метод 1: использование опции --port
Самый простой способ изменить порт Laravel Mix — использовать опцию --portпри запуске npm run watchкоманда. Например, чтобы изменить порт на 3000, вы можете выполнить следующую команду:

npm run watch -- --port=3000

Метод 2: изменение файла конфигурации Mix
Laravel Mix предоставляет файл конфигурации с именем webpack.mix.js. Вы можете изменить этот файл, чтобы изменить порт. Откройте файл webpack.mix.jsи найдите метод mix.browserSync(). Добавьте параметр port, чтобы указать желаемый номер порта:

mix.browserSync({
   proxy: 'your-project-url',
   port: 3000 // Change the port number as per your requirement
});

Метод 3: использование метода mix.options({}).
Другой способ изменить порт Laravel Mix — использовать метод mix.options({})в webpack.mix.jsфайл. Добавьте свойство port, чтобы установить нужный номер порта:

mix.options({
   port: 3000 // Change the port number as per your requirement
});

Метод 4. Создание собственного сервера разработки
Если вам требуется большая гибкость, вы можете создать собственный сервер разработки с помощью пакета webpack-dev-server. Установите пакет, выполнив следующую команду:

npm install webpack-dev-server --save-dev

Затем измените файл webpack.mix.jsследующим образом:

const mix = require('laravel-mix');
const webpack = require('webpack');
const WebpackDevServer = require('webpack-dev-server');
mix.extend('customDevServer', (webpackConfig, options) => {
    const compiler = webpack(webpackConfig);
    const server = new WebpackDevServer(compiler, options);
    server.listen(options.port, options.host, () => {
        console.log(`Custom development server running on http://${options.host}:${options.port}`);
    });
});
mix.customDevServer({
    host: 'localhost',
    port: 3000 // Change the port number as per your requirement
}, {
    // Your webpack configuration options
});

Изменение порта Laravel Mix необходимо в сценариях, где порт по умолчанию конфликтует с существующими службами или когда вам необходимо запустить сервер разработки на определенном порту. В этой статье были рассмотрены несколько методов достижения этой цели, в том числе использование параметров командной строки, изменение файла конфигурации Mix и создание собственного сервера разработки. Выберите метод, который лучше всего соответствует требованиям вашего проекта, и наслаждайтесь плавной разработкой с помощью Laravel Mix.