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

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

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

Babelは、JavaScriptの次世代仕様であるECMAScriptのコンパイラ。次世代の標準機能を用いて記述されたコードを、それらの機能に対応していないブラウザでも動作するコードに変換することができます。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

Q&A

0回答

3953閲覧

webpackのcss cacheをclearしたい

bouzjp

総合スコア10

Babel

Babelは、JavaScriptの次世代仕様であるECMAScriptのコンパイラ。次世代の標準機能を用いて記述されたコードを、それらの機能に対応していないブラウザでも動作するコードに変換することができます。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

0グッド

0クリップ

投稿2018/09/30 15:15

webpack、および webpack-dev-server での開発環境で、scss の変更が反映されません。
js と html の変更は反映されているため、 scss のみキャッシュ?により反映されていないと考えています。
一度ビルドされてしまうとそれっきりで、開発にならないため参っています。
原因としては、webpack か babel、scss-loader と css-loader 周りが怪しいと思って色々試してはいるのですが、状況が変わらないため質問させて頂きました。

今回新しく構築した環境としては、下記の通りです。

"dependencies": { "babel-polyfill": "6.26.0", "classnames": "2.2.6", "react": "16.5.2", "react-dom": "16.5.2", "react-redux": "5.0.7", "react-router": "4.3.1", "react-router-dom": "4.3.1", "react-router-redux": "4.0.8", "redux": "4.0.0", "redux-saga": "0.16.0" }, "devDependencies": { "@types/classnames": "2.2.6", "@types/react": "16.4.14", "@types/react-css-modules": "4.6.2", "@types/react-dom": "16.0.8", "@types/react-redux": "6.0.9", "@types/react-router-dom": "4.3.1", "@types/react-router-redux": "5.0.16", "autoprefixer": "9.1.5", "babel-core": "6.26.3", "babel-loader": "7.1.2", "babel-plugin-react-css-modules": "3.4.2", "babel-preset-env": "1.7.0", "babel-preset-react": "6.24.1", "css-loader": "1.0.0", "eslint": "5.6.1", "eslint-config-airbnb-base": "13.1.0", "eslint-config-prettier": "3.1.0", "eslint-loader": "2.1.1", "eslint-plugin-import": "2.14.0", "eslint-plugin-prettier": "2.7.0", "eslint-plugin-react": "7.11.1", "eslint-plugin-typescript": "0.12.0", "extract-text-webpack-plugin": "4.0.0-beta.0", "file-loader": "2.0.0", "html-webpack-plugin": "3.2.0", "node-sass": "4.9.3", "postcss-loader": "3.0.0", "postcss-scss": "2.0.0", "prettier": "1.14.3", "sass-loader": "7.1.0", "style-loader": "0.23.0", "ts-loader": "5.2.1", "typescript": "3.1.1", "typescript-eslint-parser": "19.0.2", "uglifyjs-webpack-plugin": "2.0.1", "webpack": "4.20.2", "webpack-cli": "3.1.2", "webpack-dev-server": "3.1.9" }

webpackでは下記の通り、キャッシュをコントロールしてるはずなのですが...

module.exports = (env, argv) => { const __DEV__ = argv.mode === 'development'; return ({ module: { rules: [ { test: /.(ts|tsx)$/, use: [ { loader: 'babel-loader', options: { cacheDirectory: __DEV__ } }, 'ts-loader' ] }, ... ], ... cache: false }) });

どなたかわかる方がいらっしゃればアドバイス頂けないでしょうか。

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

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

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

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

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

touho

2019/09/14 04:17

全く同じ課題に悩まされています。その後、解決策などはありましたか?
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

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

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

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

ただいまの回答率
85.48%

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

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

質問する

関連した質問