Webpack 2：从结果中排除css条目

我想用webpack编译scss和js。但是，只要我在Symfony 3中使用它，其中只有前端的一些页面使用javascript组件，我想将css编译为独立文件，并使用旧的<link href="style.css">而不是将css导入到javascript模块中。Webpack 2：从结果中排除css条目

我设法做到以下webpack.config.js，我应该产生js/script.js和css/style.css。 它的工作原理，但它也产生js/style.js，我不需要也不想要。我想问题是，入口“风格”也产生输出JS，即使通过它处理ExtractTextPlugin，但如何告诉webpack不生成一个条目的JavaScript输出？

我也试过不使用多个入口点并将index.js添加到一个入口点列表main.scss。当然，它并没有产生额外的文件，但是转译后的script.js包含了我不想要的main.scss的引用。我想要一个纯粹的解决方案来管理完全独立于脚本的样式。

const path = require('path'); 
const outputPath = path.join(__dirname, '..', 'www'); 
const ExtractTextPlugin = require('extract-text-webpack-plugin'); 
module.exports = { 
    devtool: 'source-map', 
    entry: { 
     script: ['./src/js/index.js'], 
     style: ['./src/scss/main.scss'] 
    }, 
    target: 'web', 
    output: { 
     filename: 'js/[name].js', 
     path: outputPath 
    }, 
    resolve: { 
     extensions: ['.js'] 
    }, 
    module: { 
     rules: [ 
      { // sass/scss loader for webpack 
       test: /\.(sass|scss)$/, 
       loader: ExtractTextPlugin.extract(['css-loader', 'sass-loader']) 
      } 
     ] 
    }, 
    plugins: [ 
     new ExtractTextPlugin({ // define where to save the file 
      filename: 'css/[name].css', 
      allChunks: true, 
     }) 
    ] 
};

来源

2017-08-21 amik

的WebPack似乎总是需要一个源代码文件在外部样式带来的，无论是CSS或无礼的话 - 我不认为有无论如何要解决这个问题。如果您只想将这些编译的CSS样式文件导入到您的应用程序中，并且不想拥有关联的.js文件，那么只需使用node-sass编译器并生成一个.css文件。然后或者使用webpack css加载器通过webpack将其引入到您的应用中，或者您可以在您的html文件中手动引用它。

否则只需要一个带有单一导入的Sass风格的js文件，然后在构建之后将其删除。无论哪种方式，你都会得到相同的CSS。

来源

2017-08-22 15:08:59 BoxerBucks

好吧，后面的 - 在构建之后删除不必要的JS - 实际上是我当前的解决方案，因此我将继续使用它。 – amik

Webpack 2：从结果中排除css条目

回答

相关问题