Dva: sass๊ฐ€ ๊ตฌ์„ฑ๋œ ํ›„ ์ ์šฉ๋˜์ง€ ์•Š๋Š” ์ด์œ ๋Š” ๋ฌด์—‡์ž…๋‹ˆ๊นŒ?

์— ๋งŒ๋“  2017๋…„ 06์›” 06์ผ  ยท  3์ฝ”๋ฉ˜ํŠธ  ยท  ์ถœ์ฒ˜: dvajs/dva

webpack.config.js:
webpackConfig.module.loaders.push({ test: /\.scss$/, loaders: [ 'style', 'css?sourceMap&modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]!postcss!sass' ] });

.. ์ด ์‚ฝ์ž… ์ฝ”๋“œ์— ๋ฌด์Šจ ์ผ์ด? ๋‚˜๋Š” ๊ทธ๊ฒƒ์„ ํ•ญ์ƒ ํฌ๋งทํ•  ์ˆ˜ ์—†์Šต๋‹ˆ๋‹ค.

๊ทธ๋Ÿฐ ๋‹ค์Œ index.js๋Š” sass๋ฅผ ๋„์ž…ํ•˜๊ณ  ๊ตฌ์„ฑ ์š”์†Œ์— className์„ ์ถ”๊ฐ€ํ–ˆ์ง€๋งŒ ์Šคํƒ€์ผ์„ ์ฐพ์ง€ ๋ชปํ–ˆ์Šต๋‹ˆ๋‹ค.
npm run build, index.css์˜ ํฌ๊ธฐ๊ฐ€ sass๋ฅผ ๊ฐ€์ ธ์˜ค๊ธฐ ์ „๊ณผ ์ •ํ™•ํžˆ ๋™์ผํ•œ์ง€ ํ™•์ธํ•˜์‹ญ์‹œ์˜ค.

๊ฐ€์žฅ ์œ ์šฉํ•œ ๋Œ“๊ธ€

webpackConfig.module.loaders.push({
ํ…Œ์ŠคํŠธ: /.scss$/,
๋กœ๋”: _extractTextWebpackPlugin.extract('์Šคํƒ€์ผ','css!postcss!sass')
})
if (ํ™˜๊ฒฝ == "๊ฐœ๋ฐœ") {
webpackConfig.plugins.push(new _extractTextWebpackPlugin('[์ด๋ฆ„].css'));
}

ํ˜„์žฌ ์†”๋ฃจ์…˜, ์ž‘์„ฑ์ž๊ฐ€ sass ๋ฅผ ์ถ”๊ฐ€ํ•  ๋•Œ๊นŒ์ง€ ๊ธฐ๋‹ค๋ฆฝ๋‹ˆ๋‹ค

๋ชจ๋“  3 ๋Œ“๊ธ€

์ด ๋ฌธ์ œ์— ๋Œ€ํ•ด ํ›„์† ์กฐ์น˜๋ฅผ ์ทจ ํ•˜์‹ญ์‹œ์˜ค. https://github.com/sorrycc/roadhog/issues/273

webpackConfig.module.loaders.push({
ํ…Œ์ŠคํŠธ: /.scss$/,
๋กœ๋”: _extractTextWebpackPlugin.extract('์Šคํƒ€์ผ','css!postcss!sass')
})
if (ํ™˜๊ฒฝ == "๊ฐœ๋ฐœ") {
webpackConfig.plugins.push(new _extractTextWebpackPlugin('[์ด๋ฆ„].css'));
}

ํ˜„์žฌ ์†”๋ฃจ์…˜, ์ž‘์„ฑ์ž๊ฐ€ sass ๋ฅผ ์ถ”๊ฐ€ํ•  ๋•Œ๊นŒ์ง€ ๊ธฐ๋‹ค๋ฆฝ๋‹ˆ๋‹ค

๋‹น์‹ ์€ ์ข‹์€ ๊ฒƒ์„ ๊ตฌ์„ฑํ•ฉ๋‹ˆ๋‹ค ๋‚˜๋Š” sass ๊ตฌ์„ฑ์ด ์•„๋‹™๋‹ˆ๋‹ค @sorrycc

์ด ํŽ˜์ด์ง€๊ฐ€ ๋„์›€์ด ๋˜์—ˆ๋‚˜์š”?
0 / 5 - 0 ๋“ฑ๊ธ‰