Tôi là một dự án trên Webpack mà tôi đang cố gắng thiết lập SASS transpiling với. Tôi tin rằng tôi khá gần gũi, mặc dù có vấn đề với cấu hình của tôi (code and details in the gist here).Làm cách nào để giải quyết các lỗi nhập/không được giải quyết bằng ESLint?
Chạy webpack với các mã như nó là mang lại các lỗi sau:
/foobar/src/js/components/App.jsx
6:8 error Unable to resolve path to module '../../scss/components/app' import/no-unresolved
Sau khi trải qua một thời gian về vấn đề này, tôi lưu ý rằng nếu tôi thay thế dòng import 'scss/components/app'
trong App.jsx
với import '../../scss/components/app.scss'
, các công trình transpilation. Điều này khiến tôi tin rằng có hai vấn đề:
- My
resolve.root
Cấu hình Webpack không hoạt động vì công việc nhập khẩu tương đối, nhưng không hoạt động. - My
resolve.extensions
Cấu hình webpack cũng không được áp dụng, vì tôi cần nối thêm phần mở rộng tệp.scss
để làm cho nó hoạt động.
ghi chú khác:
- Tôi đang sử dụng webpack 1.13.1.
- Nếu tôi cố ý giới thiệu các lỗi cú pháp vào tệp SCSS, webpack sẽ nhắc tôi một cách chính xác các vấn đề với tệp đó.
- Tôi cũng đã cố gắng đặt cấu hình
resolve.root
của mình dưới dạng mảng (ví dụ:[path.resolve(__dirname, './src')]
) không có kết quả. - Mục tiêu khôn ngoan, tôi hy vọng đạt được điều gì đó tương tự như this example.
- Tôi đã thử gỡ lỗi đường dẫn
import
vớiconsole-loader
và đang nhận đượcundefined
.
Bất kỳ trợ giúp nào sẽ được đánh giá cao, cảm ơn!
CẬP NHẬT: Một người bạn vừa chia sẻ rằng vấn đề là đến không phải từ sass-loader
/etc, nhưng từ eslint
.. Điều này có nghĩa là bản chất của câu hỏi này sẽ khá khác nhau (ít webpack hơn, nhiều eslint hơn).
Dù sao, số .eslintrc
của tôi kéo dài của AirBNB, tôi đoán tôi cần sửa đổi nó dựa trên các chi tiết trong this plugin.
Phần quan tâm là:
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
Tôi đã cập nhật .eslintrc
tôi giống:
{
"extends": "airbnb",
"settings": {
"import/ignore": [".scss$"]
}
}
Nhưng vẫn nhận được lỗi. Bất kỳ ý tưởng?
Cảm ơn bạn đã phản hồi nhanh! Di chuyển ESLint từ 'module.loaders' sang' module.preloaders' đã giải quyết vấn đề. –