Wordpressとgulpの組み合わせについて - gulpfile.jsでエラー
受付中
回答 0
投稿
- 評価
- クリップ 0
- VIEW 1,209
お世話になっております。
表題についてですが、普段からWordpressとgulpの組み合わせて開発を行なっているのですが、
急にgulpfile.jsでrequireのエラーが出ていることに気がつきました。
エディターはphpstormですが、requrireの部分にエラー表示がでてしまています。
cssフレームワークではfoundation6を使用しています。
bower_componentsからfoundationを読み込みたいのですが、
これについても前までは問題なくできていたのに、急にできなくなりました。
なにが原因か全くわからないのですが、
見当がつく方がいらっしゃいましたらご教授願います。
それではよろしくお願いします。
// ディレクトリ構造
├── 404.php
├── LICENSE
├── README.md
├── aaa.php
├── archive.php
├── assets
│ ├── ai
│ ├── images
│ └── pdf
├── comments.php
├── css
│ ├── app.css
│ ├── hamburgers.min.css
│ ├── jquery.mmenu.all.css
│ └── swiper.min.css
├── footer.php
├── front-page.php
├── functions.php
├── header.php
├── inc
│ ├── custom-header.php
│ ├── customizer.php
│ ├── extras.php
│ ├── jetpack.php
│ └── template-tags.php
├── index.php
├── js
│ ├── app.js
│ ├── customizer.js
│ ├── foundation.min.js
│ ├── jquery.flexnav.min.js
│ ├── jquery.mmenu.all.min.js
│ ├── navigation.js
│ ├── script.js
│ ├── sidebar-fixed.js
│ ├── skip-link-focus-fix.js
│ ├── swiper.min.js
│ └── what-input.js
├── languages
│ ├──
│ └── readme.txt
├── layouts
│ ├── content-sidebar.css
│ └── sidebar-content.css
├── page.php
├── readme.txt
├── rtl.css
├── screenshot.png
├── search.php
├── sidebar.php
├── single.php
├── src
│ ├── bower.json
│ ├── bower_components
│ ├── gulpfile.js
│ ├── node_modules
│ ├── package.json
│ └── scss
├── style.css
└── template-parts
├── content-none.php
├── content-page.php
├── content-search.php
└── content.php
var gulp = require( 'gulp' );
var csscomb = require( 'gulp-csscomb' );
var pleeease = require( 'gulp-pleeease' );
var plumber = require( 'gulp-plumber' );
var notify = require( 'gulp-notify' );
var sass = require( 'gulp-sass' );
var autoprefixer = require( "gulp-autoprefixer" );
var sourcemaps = require( 'gulp-sourcemaps' );
var $ = require( 'gulp-load-plugins' )();
var sassPaths = [ 'bower_components/foundation-sites/scss', 'bower_components/motion-ui/src' ];
var scssFiles = [ 'scss/**/!(_)*.scss', '!scss/foundation6/*.scss' ];
var foudationFiles = [ 'scss/foundation6/*.scss' ];
// css
gulp.task( 'css', function(){
gulp.src( scssFiles )
.pipe( plumber( {
errorHandler : function( err ){
notify.onError( "Error: <%= err.message %>" );
this.emit( 'end' );
}
} ) )
.pipe( pleeease( {
autoprefixer : true,
minifier : false,
mqpacker : ({
sort : false
})
} ) )
.pipe( csscomb() )
.pipe( gulp.dest( '../' ) )
.pipe( notify( 'scssをコンパイルしました!' ) );
} );
// foundation6
gulp.task( 'foundation', function(){
gulp.src( foudationFiles )
.pipe( sourcemaps.init() )
.pipe( plumber( {
errorHandler : function( err ){
notify.onError( "Error: <%= err.message %>" );
this.emit( 'end' );
}
} ) )
.pipe( sass( {
includePaths : sassPaths
} ) )
.pipe( pleeease( {
autoprefixer : true,
minifier : false,
mqpacker : ({
sort : false
})
} ) )
.pipe( csscomb() )
.pipe( sourcemaps.write() )
.pipe( gulp.dest( '../css' ) )
.pipe( notify( 'foundation6をコンパイルしました!' ) );
} );
// すみません、以下なぜかマークダウンが効かないです、、。
// package.json
{
"name": "aaa_wp_package",
"version": "1.0.0",
"description": "",
"main": "gulpfile.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "aaa",
"license": "ISC",
"devDependencies": {
"gulp": "^3.9.1",
"gulp-autoprefixer": "^3.1.1",
"gulp-csscomb": "^3.0.8",
"gulp-imagemin": "^3.2.0",
"gulp-load-plugins": "^1.1.0",
"gulp-notify": "^2.2.0",
"gulp-pleeease": "^2.0.2",
"gulp-plumber": "^1.1.0",
"gulp-pug": "^3.2.0",
"gulp-sass": "^2.3.2",
"gulp-sourcemaps": "^1.9.1"
}
}
```
// bower.json
{
"name" : "foundation-sites-template",
"version" : "1.0.0",
"authors" : [
"ZURB <foundation@zurb.com>"
],
"description" : "Basic template for a new Foundation for Sites project.",
"main" : "../index.php",
"license" : "MIT",
"homepage" : "http://foundation.zurb.com",
"dependencies" : {
"foundation-sites" : "~6.3.0",
"motion-ui" : "~1.2.2"
},
"ignore" : [
"**/.*",
"node_modules",
"bower_components",
"test",
"tests"
],
"private" : true
}
-
気になる質問をクリップする
クリップした質問は、後からいつでもマイページで確認できます。
またクリップした質問に回答があった際、通知やメールを受け取ることができます。
クリップを取り消します
-
良い質問の評価を上げる
以下のような質問は評価を上げましょう
- 質問内容が明確
- 自分も答えを知りたい
- 質問者以外のユーザにも役立つ
評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。
質問の評価を上げたことを取り消します
-
評価を下げられる数の上限に達しました
評価を下げることができません
- 1日5回まで評価を下げられます
- 1日に1ユーザに対して2回まで評価を下げられます
質問の評価を下げる
teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。
- プログラミングに関係のない質問
- やってほしいことだけを記載した丸投げの質問
- 問題・課題が含まれていない質問
- 意図的に内容が抹消された質問
- 過去に投稿した質問と同じ内容の質問
- 広告と受け取られるような投稿
評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。
質問の評価を下げたことを取り消します
この機能は開放されていません
評価を下げる条件を満たしてません
質問の評価を下げる機能の利用条件
この機能を利用するためには、以下の事項を行う必要があります。
- 質問回答など一定の行動
-
メールアドレスの認証
メールアドレスの認証
-
質問評価に関するヘルプページの閲覧
質問評価に関するヘルプページの閲覧
まだ回答がついていません
15分調べてもわからないことは、teratailで質問しよう!
- ただいまの回答率 88.22%
- 質問をまとめることで、思考を整理して素早く解決
- テンプレート機能で、簡単に質問をまとめられる