webpack不會編譯sass到外部文件

我試圖使用webpack sass（編譯到外部文件，而不是直接includind sass到一些js文件）。它不起作用，所以從輸出我會收到bundle.js和這一切，但我想有外風格。請有人幫助我嗎？webpack不會編譯sass到外部文件

我檢查了一些相關主題，但沒有找到任何有用的建議。

這裏是我的WebPack的conf

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" 
    } 
}

來源

2016-11-23 Velidan

因此，答案是：需要（「./ stylesheet.css中」）到您的js文件。

它看起來很奇怪，但實際上，對於我來說，webpack不會在沒有這個的情況下編譯sass文件（如gulp/grunt/broccoli）。

該webpack無法解析您的scss/css/style/less文件，直到您將其包含到您的某些js文件中。

來源

2016-11-23 13:51:32 Velidan

webpack不會編譯sass到外部文件

回答

相關問題