我可以在webpack中创建sass/less/css而不需要在我的JS中使用它们吗？

我目前有一些反应组件& sass正在用webpack成功构建。我还有一个主要的sass文件，可以通过一个gulp任务构建。我可以在webpack中创建sass/less/css而不需要在我的JS中使用它们吗？

我想只需要使用这些技术之一，是否可以将sass编译为css而无需关联入门文件中的sass文件？

这里试图用WebpackExtractTextPlugin

运行的WebPack后webpack.config.js

entry_object[build_css + "style.css"] = static_scss + "style.scss"; 
module.exports = { 
    entry: entry_object, 
    output: { 
    path: './', 
    filename: '[name]' 
    }, 
{ 
    test: /\.scss$/, 
    include: /.scss$/, 
    loader: ExtractTextPlugin.extract("style-loader", "css!sass") 
} 
    plugins: [ 
    new ExtractTextPlugin("[name]") 
    ]

为例，style.css的资产看起来是这样的：

/******/ (function(modules) { // webpackBootstrap 
/******/ // The module cache 
/******/ var installedModules = {}; 
/******/ 
/******/ // The require function 
/******/ function __webpack_require__(moduleId) { 

...

来源

2016-04-21 ex-zac-tly

您将需要的WebPack或吞掉到transpile SASS到CSS的最后一个例子，误足够之一，就是你的要求？ – QoP

这是某种限制吗？我通常有一些索引文件，导入所有我的风格相关的东西。 – azium

看起来像这就是你要找的虽然https://github.com/peerigon/extract-loader#examples – azium

我解决了这个在@bebraw帮助下

正如他在评论中所说的，当使用ExtractTextPlugin时，webpack将创建一个虚拟javascript文件，并跟随output.filename中的模式。因为我将ExtractTextPlugin的输出文件设置为与output.filename中的名称完全相同，所以它只输出javascript文件。通过确保output.filename和ExtractTextPlugin输出文件名的名称不同，我能够将我的sass加载到css中。

这里的webpack.config.js

entry_object[build_css + "style"] = static_scss + "style.scss"; 
module.exports = { 
    entry: entry_object, 
    output: { 
    path: './', 
    filename: '[name]' 
    }, 
{ 
    test: /\.scss$/, 
    include: /.scss$/, 
    loader: ExtractTextPlugin.extract("style-loader", "css!sass") 
} 
    plugins: [ 
    new ExtractTextPlugin("[name].css") 
    ]

来源

2016-04-24 16:55:24

你能告诉我你的''webpack.config.js''吗？我有点卡在这个。 –

我的webpack配置是我发布的snippit –

我可以在webpack中创建sass/less/css而不需要在我的JS中使用它们吗？

回答

相关问题