어떻게 성공적으로 wordpress와 함께 브라우저 동기화를 로컬로 사용할 수 있습니까?

Question

간단한 모바일/응답 개발을 위해 browser-sync을 제 multipress wordpress와 함께 설치하려고합니다.

현재 정상적인 개발은 local.example.com에서 발생하며 browser-sync는 (브라우저 동기화에 따라 123.456.78.9:3202 개를 통해)이를 프록시 처리합니다.

지금까지는 브라우저 동기화가 사이트를로드하지만 내 스크립트 또는 CSS는로드하지 않습니다 (이미지는 잘로드되지만). 그들은 네트워크 패널에서 응답없이 실패합니다.

저는 아파치와 달리 사이트 호스팅에 NGINX를 사용하고 있습니다.

누구나 어떤 WordPress 브라우저 동기화 경험이 있습니까? 브라우저 동기화 설정으로 뭔가를 놓치고 있습니까? 그리고 이것에 대한 조언은 매우 환영받을 것입니다. 나는 이것을 내 작업 흐름의 견고한 부분으로 삼고 싶다.

Answer 1

문제는 워드 프레스가 URL을 처리하는 방법은 일반적으로 프록시가 다른 도메인에서 이러한 액세스를 시도

내용과 링크 등을 포함한 전체 URL을 사용에 함께 할 것입니다 그것은 실패 이유입니다.

업데이트 A는 깨끗하고 유지 보수 전략 훨씬 간단하고, 또한 개발 환경에 도움이 그 Root Relative URLs plugin을 사용하는 것입니다. 후크 아래에 유사한 CONFIGS을 추가, 또한 동일한 구조를 적용하는 콘텐츠와 편집자를 업데이트, 그래서 더 강력한 조금

원래 대답 당신은 간단한 후크 (출처 : wordpress relative urls) 추가 할 수있어 워드 프레스를 필터링을 URL을 생성하고 스타일과 게시물 등을 기준으로 링크를 얻을 수 있도록 기본 도메인을 제거 : 당신의 문제의 대부분을 정리하고 잘 작동 브라우저 동기화를 얻어야한다

$relative_url_filters = array(
     'script_loader_src', //js 
     'style_loader_src', //css 
     'post_link',  // Normal post link 
     'post_type_link', // Custom post type link 
     'page_link',  // Page link 
     'attachment_link', // Attachment link 
     'get_shortlink', // Shortlink 
     'post_type_archive_link', // Post type archive link 
     'get_pagenum_link',   // Paginated link 
     'get_comments_pagenum_link', // Paginated comment link 
     'term_link', // Term link, including category, tag 
     'search_link', // Search link 
     'day_link', // Date archive link 
     'month_link', 
     'year_link' 
     ); 

    foreach ($relative_url_filters as $relative_url_filters) { 
     add_filter($relative_url_filters, 'wp_make_link_relative'); 
    } 

합니다.

이미지에 더 복잡한 흠집이있는 부분에 문제가 있습니다. 그러나 다소 효과적입니다. 이미 멋진 이미지를 보았습니다.