LHJ

I'm a FE developer.

gulp-connect-php 모듈 사용

17 May 2020 » node_module

gulp-connect-php 모듈 사용방법

PHP 언어를 랜더링할 수 있는 서버와 연결해야됩니다.
PHP 언어를 랜더링할 수 있는 서버와 연결하기 위해선 PHP 서버 포트번호를 사용해야됩니다.

// php 서버
import phpConnect from 'gulp-connect-php';
import browserSync from 'browser-sync';

const browserSyncReload = (done) => {
    browserSync.reload();
    done();
}

// php 서버
const phpServer = () => {
    phpConnect.server({
        // browsersync가 프록시를 통해 연결되는 독립형 PHP 서버
        // 웹 서버에 액세스하려는 포트입니다. 포트가 이미 사용 중이면 작업이 실패합니다.
        port: 8000,
        keepalive: true,
        base: "../"
    }, function () {
        browserSync({
            // php 서버 포트번호와 동일해야됩니다.
            proxy: 'localhost:80'
        })
    })
}

const gulpWatch = () => {
    watch("../html/*", browserSyncReload)
    watch("../img/order_v3/sprites/", series(cleanImg, sprites, sassBuild, browserSyncReload))
    watch([
        "../sass/",
        "../sass/vendor/!(_)*.{sass, scss}"
    ], series(cleanCss, sassBuild, browserSyncReload))
}

위에서 핵심은 php 파일을 해석하고 컴파일 할 수 있는 서버의 포트번호와 위 소스의 포트번호를 일치시켜야 된다는 겁니다.

위와 같이 작성하면 gulp로도 php 파일을 확인하며 작업할 수 있습니다.

만약 회사가 아닌 다른 PC에서 gulp를 활용하여 php파일을 작업해야될 경우일 땐, 다음과 같이 하시면 됩니다.

PS.

Mac을 사용하시는 분이라면 https://www.mamp.info/en/downloads/?m=1581611990& 왼쪽 사이트에 접속하셔서

해당 프로그램을 다운받으시면 됩니다.

윈도우라면 https://www.apachefriends.org/index.html 왼쪽 사이트에 접속하셔서

해당 프로그램을 다운받으시면 됩니다.

위 프로그램들이 하는 역할은 PHP 파일을 해석할 수 있는 로컬서버를 쉽게 만들 수 있도록 도와줍니다.
위 프로그램들에 관한 설명은 여러 블로그에 많아 생략하도록 하겠습니다.
위 프로그램들의 로컬서버 포트번호와 gulpfile 소스의 포트번호를 마찬가지로 일치시켜주면 됩니다.