Reactjs @import-ing scss文件到另一个scss文件时出现意外标记

我有一个main style.scss文件，它试图将其他.scss文件导入到自身中。使用npm start编译代码时，出现以下错误：

ERROR in ./style/style.scss
Module build failed: SyntaxError: C:/Users/XYZ/React/react-project/style/style.scss: 
Unexpected token, expected ( (1:8)

@import "_base";
        ^

ERROR in ./style/style.scss Module build failed: 
SyntaxError: C:/Users/XYZ/React/react-project/style/style.scss: 
Leading decorators must be attached to a class declaration (1:21)

> 1 | @import("_base.scss");
                           ^

我试着把它放在括号里：

@import("_base");

及

我得到了这个错误：

ERROR in ./style/style.scss
Module build failed: SyntaxError: C:/Users/XYZ/React/react-project/style/style.scss: 
Unexpected token, expected ( (1:8)

@import "_base";
        ^

ERROR in ./style/style.scss Module build failed: 
SyntaxError: C:/Users/XYZ/React/react-project/style/style.scss: 
Leading decorators must be attached to a class declaration (1:21)

> 1 | @import("_base.scss");
                           ^

这是我的webpack.config.js：

module.exports = {
    entry: [
        './src/index.js'
    ],
    output: {
        path: __dirname,
        publicPath: '/',
        filename: 'bundle.js'
    },
    module: {
        loaders: [
            {
                exclude: /node_modules/,
                loader: 'babel',
                query: {
                    presets: ['react', 'es2015', 'stage-1']
                }
            },
        ],
        rules: [{
            test: /\.scss$/,
            use: [
                "style-loader", // creates style nodes from JS strings
                "css-loader", // translates CSS into CommonJS
                "sass-loader" // compiles Sass to CSS
            ]
        }]
    },
    resolve: {
        extensions: ['', '.js', '.jsx', '.scss']
    },
    devServer: {
        historyApiFallback: true,
        contentBase: './',
        host: 'localhost',
        port: 8080
    }
};

---

我是scss新手，我在网上找到的所有教程都告诉我以这种方式导入文件。有什么问题吗？

修复了问题-我迁移到Webpack 2并将我的Webpack.config.js更改为：

module.exports = {
    entry: [
        './src/index.js'
    ],
    output: {
        path: __dirname,
        publicPath: '/',
        filename: 'bundle.js'
    },
    module: {
        rules: [
            {
                exclude: /node_modules/,
                loader: 'babel-loader',
                query: {
                    presets: ['react', ["es2015", { "modules": false }], 'stage-1']
                }
            },
            {
            test: /\.scss$/,
            use: [
                "style-loader", // creates style nodes from JS strings
                "css-loader", // translates CSS into CommonJS
                "sass-loader" // compiles Sass to CSS
            ]
        }
        ]
    },
    resolve: {
        extensions: ['.js', '.jsx', '.scss']
    },
    devServer: {
        historyApiFallback: true,
        contentBase: './',
        host: 'localhost',
        port: 8080
    }
};

---

显示您的网页配置，这是一个js错误。您没有针对babel的测试，它捕获所有内容并尝试将您的SCS编译为javascript<代码>测试：/\.js$/加载程序也是Webpack1，规则是Webpack2+。移动到规则并删除加载器您能否更具体地解释一下“移动到规则并删除加载器”的含义？如果您使用的是webpack 4，请尝试从扩展名：[''''''.js'，'.jsx'，'.scss']中删除空字符串。这将导致错误。。。。