首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >Webpack4 -模块分析失败:意外字符'@‘

Webpack4 -模块分析失败:意外字符'@‘
EN

Stack Overflow用户
提问于 2020-03-10 04:28:04
回答 1查看 53关注 0票数 0

我是新手使用webpack,我遇到了一个问题,我认为css-loader无法解决我的@import

Webpack Cofig:

代码语言:javascript
复制
const config = {
    entry: {
        main: __dirname + '/js/index.jsx'
    },
    devtool: 'eval-source-map',
    plugins: [
        new MiniCssExtractPlugin({
            filename: isDevelopment ? '[name].css' : '[name].[hash].css',
            chunkFilename: isDevelopment ? '[id].css' : '[id].[hash].css'
        })
    ],
    module: {
        rules: [
            {
                test: /\.jsx?/,
                loader: 'babel-loader',
                exclude: /node_modules/,
            },
            {
                test: /\.s(a|c)ss$/m,
                include: [
                    resolve(__dirname, '/sass'),
                ],
                use: [
                    {
                        loader: isDevelopment ? 'style-loader' : MiniCssExtractPlugin.loader,
                    },
                    {
                        loader: 'css-loader',
                    },
                    {
                        loader: 'sass-loader',
                        options: {
                            sourceMap: isDevelopment,
                            implementation: require('sass')
                        }
                    }
                ]
            }
        ]
    }
}

文件夹结构:

代码语言:javascript
复制
application
|
|___static
|     |____dist
      |____js
      |     |____react components in here
      |____sass
      |      |____abstracts
      |      |        |____variables.scss
      |      |____pages
      |      |      |_____app.scss
      |      |____main.scss   
      |____package-lock.json
      |____package.json
      |____webpack.config.js

main.scss的内容在错误中。

错误:

代码语言:javascript
复制
ERROR in ./sass/main.scss 1:0
Module parse failed: Unexpected character '@' (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> @import 'abstracts/variables';
| @import 'pages/app';
| 
 @ ./js/components/App.jsx 20:0-37 35:19-25
 @ ./js/routes.js
 @ ./js/index.jsx

任何指针都会很棒!谢谢!

亚历克斯

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2020-03-10 05:39:35

问题是

代码语言:javascript
复制
                include: [
                    resolve(__dirname, '/sass'),
                ],

已删除,并按预期工作。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/60607896

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档