質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
docker-compose

docker-composeとは、複数のコンテナで構成されるサービスを提供する手順を自動的し管理を簡単にするツール。composeファイルを使用しコマンド1回で設定した全サービスを作成・起動することが可能です。

gulp

gulpは、Node.jsをベースとしたタスク自動化ツールの一つ。ストリームでファイルを処理することが特徴です。CSSプリプロセッサの使用時のコンパイルや、CSS・JavaScriptファイルの圧縮・結合などを自動的に行うことができます。

Q&A

0回答

1128閲覧

dockerとbrowsersyncとgulpの不具合

KatsuyaYamamoto

総合スコア8

docker-compose

docker-composeとは、複数のコンテナで構成されるサービスを提供する手順を自動的し管理を簡単にするツール。composeファイルを使用しコマンド1回で設定した全サービスを作成・起動することが可能です。

gulp

gulpは、Node.jsをベースとしたタスク自動化ツールの一つ。ストリームでファイルを処理することが特徴です。CSSプリプロセッサの使用時のコンパイルや、CSS・JavaScriptファイルの圧縮・結合などを自動的に行うことができます。

0グッド

0クリップ

投稿2017/10/18 09:31

###前提・実現したいこと
gulp + dockerで、wordpressを開発しているのですが、
gulpで用いているbrowserSyncのExternalURLが、カスタム投稿ディレクト以下になると参照元をlocalhostにします。
そのためスマートフォンでExternalURLを開いてもlocalhostを参照しているので表示が崩れます。
カスタム投稿ページ以下でもExternalURLを開きたいです。
wordpressのトップと固定ページはExternalURLを参照してます。

###package.json

{ "name": "hogehoge", "version": "1.0.0", "description": "", "main": "gulpfile.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "author": "", "license": "ISC", "devDependencies": { "browser-sync": "^2.18.6", "gulp": "^3.9.1", "gulp-autoprefixer": "^3.1.1", "gulp-notify": "^3.0.0", "gulp-plumber": "^1.1.0", "gulp-sass": "^3.1.0", "gulp-sourcemaps": "^2.4.0" } }

###gulpfile.js

'use strict'; var gulp = require('gulp'); var browserSync = require('browser-sync').create(); var sass = require('gulp-sass'); var sourcemaps = require('gulp-sourcemaps'); var autoprefixer = require('gulp-autoprefixer'); var plumber = require('gulp-plumber'); var notify = require('gulp-notify'); //dockerが起動しているポート番号 var docker = 9104; var SCSS_FILE = './sass/**/*.scss'; var WATCH_FILE = [ './inc/**', './contents/**/*.php', './js/**', './css/**', './**.html', './**.php', ]; // -------------------------------------------- // Sass // -------------------------------------------- gulp.task('sass',function(){ gulp.src([SCSS_FILE]) .pipe(plumber({ errorHandler: notify.onError('Error: <%= error.message %>') })) .pipe(sourcemaps.init()) .pipe(sass({outputStyle: 'compressed'})) .pipe(autoprefixer()) .pipe(sourcemaps.write()) .pipe(gulp.dest('./css')) .pipe(browserSync.reload({stream:true})); }); // -------------------------------------------- // browser-sync // -------------------------------------------- gulp.task('browser-sync', function () { browserSync.init({ proxy: 'localhost:' + docker + '/wp-admin', open: 'external', notify: false }); }); // -------------------------------------------- // Watch // -------------------------------------------- gulp.task('watch',function(){ gulp.watch(SCSS_FILE,['sass']); gulp.watch([WATCH_FILE]).on('change', browserSync.reload); }); // -------------------------------------------- // Gulp Detault // -------------------------------------------- gulp.task('default', ['browser-sync', 'watch']);

###docker-compose.yml

version: "2" services: web: build: . command: php -S 0.0.0.0:80 -t /code/wordpress/ ports: - "9104:80" depends_on: - db volumes: - db-data:/var/lib/mysql - ./uploads:/code/wordpress/wp-content/uploads # テーマのマウント - ./themes:/code/wordpress/wp-content/themes # プラグインのマウント - ./plugins:/code/wordpress/wp-content/plugins # プラグインのマウント - ./wp-config.php:/code/wordpress/wp-config.php # 言語設定のマウント - ./languages:/code/wordpress/wp-content/languages # インポートしたsql内のURLを置換するファイルをマウント - ./Search-Replace-DB-master:/code/wordpress/Search-Replace-DB-master db: image: mysql:5.6 ports: - "3104:3306" environment: MYSQL_DATABASE: wordpress MYSQL_ROOT_PASSWORD: wordpress volumes: db-data: driver: local

###Dockerfile

FROM php:5.4-apache RUN apt-get update && \ docker-php-ext-install pdo_mysql mysqli mbstring # https://ja.wordpress.org/releases/ から、gz形式で欲しいWPバージョン # WPのバージョンをWP_VER変数に入れる ENV WP_VER 4.8 # WPインストール RUN apt-get install -y wget WORKDIR / RUN mkdir /code WORKDIR /code RUN wget https://ja.wordpress.org/wordpress-$WP_VER-ja.tar.gz RUN tar zxvf wordpress-$WP_VER-ja.tar.gz -C /code RUN rm wordpress-$WP_VER-ja.tar.gz WORKDIR /code/wordpress RUN mv wp-config-sample.php wp-config.php # DB_NAME ENV NAME wordpress # DB_USER ENV USER root # DB_PASSWORD ENV PASSWORD wordpress # DB_HOST ENV HOST db:3306 RUN sed -i -e "s/database_name_here/$NAME/g" wp-config.php RUN sed -i -e "s/username_here/$USER/g" wp-config.php RUN sed -i -e "s/password_here/$PASSWORD/g" wp-config.php RUN sed -i -e "s/localhost/$HOST/g" wp-config.php

よろしくお願いします

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問