【问题标题】:Webpack 2 regex test failingWebpack 2 正则表达式测试失败
【发布时间】:2017-06-07 21:41:25
【问题描述】:

我不明白为什么我的加载程序测试失败了。

我的目标:

测试 1:

匹配任何global.cssglobal.scss

测试 2

匹配global.scssglobal.css


原因是我不希望任何名为 global 的文件通过 module 选项传递

似乎我的第一个测试是让全球性的。使用https://regex101.com/ 等工具时,我可以看到我的正则表达式都正确返回真/假。

这可能是我的include吗?

帮助! :)

webpack.config.js

        {

            test: /^(?!global\.s?css$).*\.s?css$/,
            include: SRC_DIR,
            use: extractPlugin.extract({
                use: [
                    {
                        loader: 'css-loader',
                        options: {
                            modules: true,
                            camelCase: true
                        }
                    },
                    {
                        loader: 'postcss-loader',
                        options: { 
                            plugins: (loader) => [require('autoprefixer')()]
                        }
                    },
                    'resolve-url-loader',
                    {
                        loader: 'sass-loader',
                        options: { sourceMap: true }
                    }
                ]
            })
        },

        {

            test: /^global\.s?css$/,
            include: SRC_DIR,
            use: extractPlugin.extract({
                use: [
                    'css-loader',
                    {
                        loader: 'postcss-loader',
                        options: { 
                            plugins: (loader) => [require('autoprefixer')()]
                        }
                    },
                    'resolve-url-loader',
                    {
                        loader: 'sass-loader',
                        options: { sourceMap: true }
                    }
                ]
            })
        }

【问题讨论】:

  • 测试期望匹配整个文件路径,例如'path/to/global.scss',而不仅仅是'global.scss'。
  • 如果是这样,那为什么test: /\.(css|scss)$/ 有效?

标签: javascript regex webpack css-modules


【解决方案1】:

对于测试 2,请尝试从您的正则表达式中删除 ^。测试与文件路径匹配,而不仅仅是文件名,因此从路径的开头开始会导致它失败。

对于测试 1,您可以通过使用 test: \/.s?css$\ 来捕获所有样式,然后添加 exclude: \global.s?css$\ 以防止包含全局来简化此否定模式。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-04-24
    • 2019-11-09
    相关资源
    最近更新 更多