2016-06-12 34 views
5

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 đề:

  1. 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.
  2. 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ới console-loader và đang nhận được undefined.

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?

Trả lời

4

Bạn có thể đăng tất cả các tệp trong gist không? Tôi đã cố gắng tìm kiếm các vấn đề chỉ bằng cách nhìn vào mã nhưng một ví dụ chạy được với tất cả các tập tin và nhập khẩu trong cấu hình webpack sẽ hữu ích hơn.

Tôi rất tò mò tại sao bạn thêm eslint vào bộ tải thay vì trình tải trước. Bạn cần thêm nó vào trình tải trước.

+1

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 đề. –

Các vấn đề liên quan