简体   繁体   English

如何配置webpack 3.5.4只为JS创建源映射,并跳过CSS?

[英]How can I configure webpack 3.5.4 to only create source maps for JS, and skip CSS?

I've been trying to figure out how to skip the CSS source maps in production, because I only need JS. 我一直在尝试找出如何在生产中跳过CSS源映射,因为我只需要JS。 Is there a way to do this? 有没有办法做到这一点?

I can just delete the *.css.map files later, but I think the build would be faster if I can skip them. 我可以稍后再删除*.css.map文件,但我认为如果可以跳过它们,构建速度会更快。

The following is a snippet from my webpack config. 以下是我的webpack配置中的片段。 You can simply set the value of sourceMap option to false : 您可以简单地将sourceMap选项的值设置为false

 {
                    test: /\.css$/,
                    exclude: /node_modules/,
                    use: [
                        {
                            loader: 'style-loader',
                        },
                        {
                            loader: 'css-loader',
                            options: {
                                sourceMap: false,
                                importLoaders: 2,
                            },
                        },
                        {
                            loader: 'resolve-url-loader',
                        },
                        {
                            loader: 'postcss-loader',
                            options: {
                                sourceMap: false,
                            },
                        },
                    ],
                },

You can also use suppress-chunks-webpack-plugin to remove the .css.map files, because webpack still writes them even if they are empty. 您还可以使用prevent-chunks-webpack-plugin删除.css.map文件,因为即使它们为空,webpack仍会写入它们。

Add a new plugin to your config: 将新插件添加到您的配置中:

// Skip empty CSS source maps
new SuppressChunksPlugin([     
  { name: 'your-entry', match: /\.css\.map$/ },
]),

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 如何配置 Storybook.js Webpack 以使用 Next.js 项目中 CSS 模块中的绝对图像路径? - How can I configure Storybook.js Webpack to work with absolute image paths in CSS modules in a Next.js project? 有没有什么方法可以用 webpack 只生成 CSS 源映射? - Is there any way to generate only CSS source maps with webpack? 如何配置我的 webpack 以便我可以调试我的源文件而不是捆绑文件? - How can I configure my webpack so that I can debug my source files instead of the bundled files? 如何使用 Webpack 从 JS 文件中提取 CSS 文件? - How can I extract CSS files from JS files with Webpack? 如何配置 webpack.config.js 将我的 HTML 文件转换/转换为 reactjs 中的 JS? - How can I configure webpack.config.js to convert/transform my HTML file into JS in reactjs? "如何防止 webpack 为 css 创建 js 文件?" - How to prevent webpack to create js file for css? 如何配置Webpack输出以仅包含特定包的某些选项 - How can I configure Webpack output to include some options only for a particular bundle 如何在 postcss.config.js 中为不同的 Webpack 入口点配置不同的 customProperties? - How can I configure different customProperties in postcss.config.js for different Webpack entry points? js如何在getComputedStyle规则中获取源CSS规则 - js how can I get the source css rule in getComputedStyle rule 如何使用HTML,JS和CSS创建自定义文件上载 - How Can I Create a Custom File Upload With Only HTML, JS and CSS
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM