webpack报了很多错 不知道怎么解决 望高人求教

Question

ERROR in ./src/components/artical.vue?vue&type=script&lang=js& (./node_modules/babel-loader/lib??ref--1!./node_modules/vue-loader/lib??vue-loader-options!./src/components/artical.vue?vue&type=script&lang=js&)
Module not found: Error: Can't resolve '../components/comment' in '/Users/laiyinan/Documents/前端开发/blog/src/components'

ERROR in ./src/App.vue?vue&type=style&index=0&lang=scss& (./node_modules/vue-loader/lib??vue-loader-options!./src/App.vue?vue&type=style&index=0&lang=scss&) 8:0

ERROR in ./src/components/userInfo.vue?vue&type=style&index=0&id=0a4b02ae&lang=scss&scoped=true& (./node_modules/vue-loader/lib??vue-loader-options!./src/components/userInfo.vue?vue&type=style&index=0&id=0a4b02ae&lang=scss&scoped=true&) 474:0
Module parse failed: Unexpected token (474:0)
File was processed with these loaders:
 * ./node_modules/vue-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.

配置如下：

module.exports = {
    mode: 'production',
    entry: path.resolve(root, 'src/main.js'),
    output: {
        path: path.resolve(root, './dist'),
        filename: 'bundle.js',
        publicPath: ''
    },
    module: {
        rules: [
            {
                test: /\.html$/i,
                use: [
                    'html-loader',
                    // 'vue-template-loader'
                ]
            },
            {
                test: /\.js$/,
                loader: 'babel-loader',
                options: {
                    babelrc: false,
                    plugins: [
                        "dynamic-import-webpack"
                    ]
                },
                exclude: /node_modules/
            },
            {
                test: /\.vue$/,
                loader: 'vue-loader',
                options: {
                    loaders: {
                        scss: 'vue-style-loader!css-loader!sass-loader',
                        sass: 'vue-style-loader!css-loader!sass-loader?indentedSyntax'
                    }
                }
            },
            {
                test: /\.(png|jpe?g|gif)$/,
                oneOf: [
                    {
                        resourceQuery: /base64/,
                        use: ['url-loader']
                    },
                    {
                        use: [
                            {
                                loader: 'url-loader',
                                options: {
                                    limit: 1,
                                    name: 'img/[name].[hash:7].[ext]'
                                }
                            }
                        ]
                    }
                ]
            },
            {
                test: /\.css$/,
                use: [
                    {
                        loader: 'css-loader',
                        options: {
                            modules: {
                                localIdentName: 'css/[name].[hash:7].[ext]'
                            }
                        }
                    }
                ]
            },
            {
                test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
                loader: 'url-loader',
                options: {
                    limit: 1,
                    name: 'fonts/[name].[ext]',
                },
            },
            {
                test: /\.(svg)(\?.*)?$/,
                loader: 'url-loader',
                options: {
                    limit: 1,
                    name: 'svg/[name].[ext]',
                },
            }
        ]
    },
    plugins: [
        new VueLoaderPlugin(),
        new HtmlWebpackPlugin({
            template: path.resolve(root, "public/index.html")
        })
    ]
};

Answer 1

module.exports = {
    module: {
        rules: [ {
            test: /\.scss$/,
            loaders: ['style', 'css', 'sass']
        } ]
    }
}

可能需要安装node-sass和sass-loader