Module not found: Error: Can't resolve './style'：配置 extensions 的坑

ERROR in ./src/index.js Module not found: Error: Can't resolve './style' in 'D:\gitcode\github\learn-webpack\demo15\src' @ ./src/index.js 8:0-17

網上的解決方案

1.確認是否安裝 css-loader 和 style-loader

npm install css-loader style-loader -D

2.配置 module.rules

// webpack.config.js
module.exports = {
    module: {
        rules: [
            {
                test: /\.css$/,
                use: ['style-loader', 'css-loader']
            }
        ]
    }
}

我的問題及解決方案

我的錯誤其實是 在配置 resolve.extensions 時發生錯誤，我配置成了
extensions: ['js', 'css', 'json'] ×
正確的配置方法是：

// webpack.config.js
module.exports = {
    resolve: {
        extensions: ['.js', '.css', '.json']
    }
}

總結：

• resolve.extensions 擴展名要求寫全，不支持不加 . 的寫法。
• 報錯提示找不到 ./style 模塊，其實就是因為補全擴展名的配置沒有生效。