如何使用ESLint解决导入/未解决的错误？

Question

我在Webpack上有一个项目,我正在尝试设置SASS进行转换.我相信我非常接近,虽然我的配置存在问题(这里的代码和详细信息).

使用代码运行webpack会产生以下错误:

/foobar/src/js/components/App.jsx
  6:8  error  Unable to resolve path to module '../../scss/components/app'  import/no-unresolved

在花了一段时间这一点,我注意到,如果我取代了import 'scss/components/app'线App.jsx与import '../../scss/components/app.scss'中,transpilation工作.这让我相信有两个问题:

1. 我的resolve.rootWebpack配置不起作用,因为相对导入工作,但不是绝对的.
2. 我的resolve.extensionsWebpack配置也没有应用,因为我需要附加.scss文件扩展名以使其正常工作.

其他说明:

• 我正在使用webpack 1.13.1.
• 如果我故意在SCSS文件中引入语法错误,webpack会正确地提示我该文件的问题.
• 我也尝试将我的resolve.root配置设置为数组(即[path.resolve(__dirname, './src')])无济于事.
• 目标方面,我希望能够实现类似于这个例子的东西.
• 我已经尝试过调试import路径console-loader了undefined.

任何帮助将不胜感激,谢谢!

更新:一位朋友刚刚分享了这个问题不是来自sass-loader/等,而是来自eslint.这意味着这个问题的性质将会大不相同(更少的webpack,更多的eslint).

无论如何,我.eslintrc扩展了AirBNB的,我猜我需要根据这个插件的细节修改它.

感兴趣的部分是:

settings:
  import/ignore:
    - node_modules       # mostly CommonJS (ignored by default) 
    - \.coffee$          # fraught with parse errors 
    - \.(scss|less|css)$ # can't parse unprocessed CSS modules, either 

我更新了我的内容.eslintrc:

{
    "extends": "airbnb",
    "settings": {
        "import/ignore": [".scss$"]
    }
}

但我仍然得到错误.有任何想法吗？

Answer 1

您可以发布要点中的所有文件吗？我尝试仅通过查看代码来查找问题，但包含 webpack 配置中的所有文件和导入的可运行示例会更有帮助。

我很好奇为什么你将 eslint 添加到加载器而不是预加载器中。您需要将其添加到预加载器中。