2016-11-23 6 views
0

Я попытался использовать webpack для sass (компиляция для внешнего файла, а не прямая, включая sass для некоторых js-файлов). Это не работает, поэтому с выхода я получаю bundle.js, и все, но я хочу иметь внешний стиль.webpack не компилирует sass во внешний файл

Я не знаю, что я делаю неправильно. Может ли кто-нибудь помочь мне, пожалуйста?

Я проверил несколько относительных тем, но не нашел полезных советов.

Вот мой WebPack конф

var ExtractTextPlugin = require('extract-text-webpack-plugin'); 

module.exports = { 
    entry: "./entry.js", 
    output: { 
     path: __dirname, 
     filename: "bundle.js" 
    }, 
    module: { 
     loaders: [ 
      { 
       test: /\.scss$/, 
       loader: ExtractTextPlugin.extract('style', 'raw!sass') 
      } 
     ] 
    }, 
    plugins: [ 
    new ExtractTextPlugin('style.css', { 
     allChunks: true 
    }) 
    ] 
}; 

zeta.scss

@import "hamma"; 

html { 
    color: red; 

    &.blue { 

     color: black; 

    } 
} 

hamma.scss

html { 
color: purple !important; 
} 

файловая структура очень проста

entry.js 
zeta.scss 
hamma.scss 
webpack.config. 
package.json 

мой package.json

{ 
    "name": "dsfsdfdsfds", 
    "version": "1.0.0", 
    "main": "entry.js", 
    "scripts": { 
    "test": "sdf" 
    }, 
    "author": "", 
    "license": "ISC", 
    "description": "", 
    "devDependencies": { 
    "css-loader": "^0.26.0", 
    "extract-text-webpack-plugin": "^1.0.1", 
    "node-sass": "^3.13.0", 
    "sass-loader": "^4.0.2", 
    "style-loader": "^0.13.1", 
    "webpack": "^1.13.3" 
    } 
} 

ответ

0

Итак, ответ: требуется ("./ stylesheet.css") в файл JS.

Это выглядит странно, но на самом деле для меня webpack не скомпилирует файлы sass без этого (например, gulp/grunt/broccoli).

Веб-сайт не анализирует ваши файлы scss/css/style/less, пока вы не включите их в некоторые из ваших js-файлов.

Смежные вопросы