Laravel mixでproductionビルドするとCSS Loader Invalid Optionsのエラーが発生する
Laravel Mixで開発をしていおります。
下記のようなpackage.jsonの設定をしており、development
ビルドではエラーも何も発生せず正常に処理が出来ております。
package.json
{
"private": true,
"scripts": {
"dev": "npm run development",
"development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"watch": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"watch-poll": "npm run watch -- --watch-poll",
"hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
"prod": "npm run production",
"production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
},
"devDependencies": {
"@voerro/vue-tagsinput": "^1.11.2",
"axios": "^0.16.2",
"bootstrap": "4.1.3",
"bootstrap-sass": "3.3.7",
"cropperjs": "^1.5.1",
"cross-env": "^5.0.1",
"exif-js": "^2.3.0",
"font-awesome": "^4.7.0",
"jquery": "^3.3.1",
"laravel-mix": "^1.0",
"lodash": "^4.17.4",
"owl.carousel": "^2.3.4",
"popper.js": "^1.14.4",
"vue": "^2.1.10",
"vue-cropperjs": "^3.0.0"
},
"dependencies": {
"css-loader": "^2.1.1",
"dropzone": "^5.5.1",
"es6-promise": "^4.2.6",
"html2canvas": "^1.0.0-alpha.12",
"loaders.css": "^0.1.2",
"sass-loader": "^7.1.0",
"slick-carousel": "^1.8.1",
"vue-observe-visibility": "^0.4.3",
"vue-qriously": "^1.1.1",
"vuex": "^3.1.0"
}
}
ただ、npm run prod
とし、production
用のビルドを走らせると、下記のようなcss-loaderのエラーが出てしまっております。
ERROR in ./node_modules/css-loader/dist/cjs.js?minimize!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-6434f8e0","scoped":true,"hasInlineConfig":true}!./node_modules/sass-loader/lib/loader.js!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./resources/assets/js/components/Loading.vue
Module build failed: ValidationError: CSS Loader Invalid Options
options should NOT have additional properties
at validateOptions (/application/node_modules/css-loader/node_modules/schema-utils/src/validateOptions.js:32:11)
at Object.loader (/application/node_modules/css-loader/dist/index.js:44:28)
@ ./node_modules/vue-style-loader!./node_modules/css-loader/dist/cjs.js?minimize!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-6434f8e0","scoped":true,"hasInlineConfig":true}!./node_modules/sass-loader/lib/loader.js!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./resources/assets/js/components/Loading.vue 4:14-367
@ ./resources/assets/js/components/Loading.vue
@ ./resources/assets/js/mypage.js
@ multi ./resources/assets/js/mypage.js
こちらのサイトなどを参考に、css-loaderが悪さをしていそうなところまではわかったのですが、developmentとproductionで結果が違うのがなぜなのか、原因がわからずでおります。
どなたか、原因・解決策をご存知の方がいらっしゃいましたら、ご教授頂けますと幸いでございます。
何卒、よろしくお願いいたします。