2015-12-03 20 views
19

Tôi đang cố gắng tạo mô-đun npm và tôi không thể tìm thấy hướng dẫn đơn lẻ trên trang web chính thức của babeljs. Làm thế nào để bạn sử dụng gói babel-runtime? Từ tên tôi đoán nó nên được đặt trong phần "phụ thuộc" của package.json, phải không?Làm thế nào để sử dụng thời gian chạy babel trong Babel 6?

Hoàn toàn không có thông tin ở đây: https://github.com/babel/babel/tree/master/packages/babel-runtime

Tìm thấy một ví dụ ở đây: https://strongloop.com/strongblog/javascript-babel-future/ nhưng khi tôi chạy "babel -h" nó không liệt kê --optional như một tham số hợp lệ.

Trả lời

6

Thời gian chạy là tùy chọn, nhưng giống như mọi thứ khác trong Babel 6, chủ yếu được bật bằng cách thêm plugin. Trong trường hợp này, bạn cần http://babeljs.io/docs/plugins/transform-runtime/

plugins: ["transform-runtime"] 
  • babel-runtime là một gói phần mềm có chứa một polyfill và nhiều thứ khác mà Babel có thể tham khảo. Bạn sẽ cài đặt ứng dụng trong ứng dụng của mình với npm install babel-runtime
  • transform-runtime là một plugin Babel để xử lý mã nguồn của bạn và tiêm các câu lệnh import foo from "babel-runtime" để thực tế sử dụng babel-runtime. Bạn cũng sẽ cài đặt ứng dụng này với npm install babel-plugin-transform-runtime.
+17

Sau đó, sự khác biệt giữa gói plugin 'chuyển đổi-thời gian chạy' và gói 'thời gian chờ' là gì? Làm thế nào tôi có thể xác minh rằng điều này đang hoạt động? – cosmosb

23

Khi transpiling mã của bạn, Babel sẽ thực sự tiêm những người giúp đỡ để bắt chước các tính năng không được hỗ trợ bởi phiên bản ES bạn nhắm mục tiêu.

Ví dụ: class MyClass {} tận dụng trợ giúp nội tuyến _classCallCheck, bạn cũng có thể truy cập thông qua require('babel-runtime/helpers/classCallCheck').

Theo mặc định, những người trợ giúp không được chia sẻ giữa các đơn vị biên dịch (tệp). Nhóm Babel mặc dù có thể thú vị khi quyết định chúng ở một nơi, cho phép tiết kiệm không gian khi chúng được sử dụng nhiều lần.

Sự cố này đã được giải quyết bằng cách tạo plugin babel-plugin-transform-runtime, đi bộ AST và thay thế các đoạn trợ giúp theo yêu cầu thích hợp của mô-đun babel-runtime. Bằng cách đó, những người giúp đỡ được chia sẻ trên codebase và tránh trùng lặp.

Làm thế nào để sử dụng nó

Giả sử bạn có một running Babel environment:

  1. Install babel-plugin-transform-runtime (như là một devDependency), mà biến đổi mã của bạn để loại bỏ các người giúp đỡ và sử dụng những người thân trong babel-runtime. Bạn cần phải thêm nó vào plugins mảng của cấu hình Babel của bạn
  2. Install babel-runtime (như là một dependency), là thư viện thực tế babel-plugin-transform-runtime giả sử bạn sẽ có trong dependencies của bạn, nó sẽ được sử dụng bởi mã transpiled của bạn trong thời gian chạy. Bạn không cần phải yêu cầu nó ở bất cứ nơi nào trong mã của bạn.

Minimal đoạn

  • npm run build biên dịch thư mục lib vào dist
  • npm start bắt đầu dist thư mục (mà phụ thuộc vào babel-runtime)

package.json

{ 
    "scripts": { 
    "build": "babel lib --out-dir=dist", 
    "start": "node dist" 
    }, 
    "dependencies": { 
    "babel-runtime": "^6.9.2" 
    }, 
    "devDependencies": { 
    "babel-cli": "^6.10.1", 
    "babel-plugin-transform-runtime": "^6.9.0" 
    }, 
    "babel": { 
    "plugins": [ 
     "transform-runtime" 
    ] 
    } 
} 
+0

Hi @aymericbeaumet, tôi nghĩ câu trả lời của bạn giả định một môi trường nút. Đúng không? Nếu vậy, những gì nên được thực hiện trong một môi trường trình duyệt (không có nút phụ trợ)? Có bất kỳ mục thời gian chạy nào cần thiết không? – Zander

+0

@Zander: bạn có muốn chạy babel _in_ trình duyệt không? – aymericbeaumet

+0

hi @aymericbeaumet, hãy để tôi làm rõ: Tôi có nghĩa là khi tính toán mã es6 để chạy trong trình duyệt (ví dụ: gulp/grunt/webpack, v.v.) không sử dụng babel để transpile khi đang di chuyển. Điều đó có ý nghĩa? – Zander

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