如何設置Ramda在彙總與巴貝爾（使用ES6進口）

之前問這個問題，我想分享第一我的項目的文件夾結構：我想使用Ramda作爲一個模塊如何設置Ramda在彙總與巴貝爾（使用ES6進口）

在我的項目，所以在我的./app/js* .js文件文件，我可以這樣做：

include map from 'ramda/src/map';

基本上我希望能夠輕鬆導入Ramda作爲一個模塊，這樣我可以訪問不同的功能，如上圖所示。我已將ramda作爲node_modules目錄中的模塊進行安裝，並使用匯總來構建用ES6編寫的我的js文件。

我rollup.config.js文件看起來像這樣：

import babel from 'rollup-plugin-babel'; 
import eslint from 'rollup-plugin-eslint'; 
import commonjs from 'rollup-plugin-commonjs'; 

export default { 
    entry: 'app/js/main.js', 
    dest: 'app/min/main.min.js', 
    format: 'iife', 
    sourceMap: 'inline', 
    plugins: [ 
     eslint({ 
      'exclude': [ 
       'app/css/**' 
      ] 
     }), 
     babel(), 
     commonjs({ 
      include: 'node_modules/**' 
     }) 
    ] 
};

我真的很感激如何設置正確的./app/js目錄來使用它的一些建議。如果問題不明確，請告知我。

謝謝。

來源

2017-04-23 Daler

我能夠解決這個問題。同樣的設置。我所要做的只是更改rollup.config.js配置。更詳細的，我跟着以下步驟進行：

安裝該插件rollup-plugin-node-resolve，使彙總成爲了第三方模塊訪問項目文件（node_modules如Ramda）：
```
npm install --save-dev rollup-plugin-node-resolve 
```
於是，我只好在rollup.config.js添加resolve作爲一個依賴如下：

在放置在文件的頂部：
```
import resolve from 'rollup-plugin-node-resolve'; 
```

的plugins陣列以下參數中調用解決方法：

//...code before 
resolve({ 
    jsnext: true, 
    browser: true, 
    main: true, 
    preferBuiltins: false 
}), 
//...code after

從babel排除node_modules並列入commonjs一切以確保模塊傳遞到項目作爲依賴關係：

//...code before 
babel({ 
    exclude: "node_modules/**", 
    runtimeHelpers: false 
}), 
commonjs({ 
    include: 'node_modules/**' 
}) 
//...code after

的rollup.config.js文件看起來像這到底：

import babel from 'rollup-plugin-babel'; 
import eslint from 'rollup-plugin-eslint'; 
import commonjs from 'rollup-plugin-commonjs'; 
import resolve from 'rollup-plugin-node-resolve'; 

export default { 
    entry: 'app/js/main.js', 
    dest: 'app/min/main.min.js', 
    format: 'iife', 
    sourceMap: 'inline', 
    plugins: [ 
     resolve({ 
      jsnext: true, 
      browser: true, 
      main: true, 
      preferBuiltins: false 
     }), 
     eslint({ 
      'exclude': [ 
       'app/css/**' 
      ] 
     }), 
     babel({ 
      exclude: "node_modules/**", 
      runtimeHelpers: false 
     }), 
     commonjs({ 
      include: 'node_modules/**' 
     }) 
    ] 

};

那到底爲我工作。在./app/js/目錄中的任何文件，我能夠從Ramda導入具體功能如下：

import {default as map} from 'ramda/src/map';

此外，通過上述步驟去後，我還能夠安裝和集成這個驚人的插件這使得導入特定功能變得更加容易 - babel-plugin-ramda。

然後，你可以在一個更簡單的方式導入特定的功能：

import {map, curry} from 'ramda'

由於該插件，只有指定的功能將被提供。

希望這可以幫助任何遇到同樣問題的人，或者幫助那些將來會遇到同樣問題的人。

乾杯。

來源

2017-04-23 11:04:33 Daler

如何設置Ramda在彙總與巴貝爾（使用ES6進口）

回答

相關問題