如何通過動態路徑與流星

導入這是我如何導入所有收集的聲明與方法，裝置和出版物現在：如何通過動態路徑與流星

import './news/collection.js'; 
import './news/methods.js'; 

if (Meteor.isServer) { 
    import './news/server/fixtures.js'; 
    import './news/server/publications.js'; 
}

如果你添加了一些新的集合，你必須重新寫：

import './comments/collection.js'; 
import './comments/methods.js'; 

if (Meteor.isServer) { 
    import './comments/server/fixtures.js'; 
    import './comments/server/publications.js'; 
}

當你有大量的收藏，你必須一次又一次地寫。最後，對於乾燥的緣故，你會喜歡寫這樣的事：

let collections = ['news', 'comments', ... 'everything']; 

for (let collection of collections) { 
    import `./${collection}/collection.js`; 
    import `./${collection}/methods.js`; 
    if (Meteor.isServer) { 
    import `./${collection}/server/fixtures.js`; 
    import `./${collection}/server/publications.js`; 
    } 
}

現在The Unexpected token, expected {錯誤拋出。

我搜索了流星文檔，並不能相信它：它真的沒有辦法通過動態路徑導入流星的東西嗎？

來源

2016-11-28 ivanzolotov

不ES6甚至支持這種模式？ –

看起來不像。所以使用'require'語法看起來是實現我想要的唯一可能的方式。 – ivanzolotov

不支持動態導入。有很多人誰願意做這個（包括我自己），但它尚未公佈，無論是在流星或其他地方，如進口是一個ES6功能

來源

2016-11-28 20:01:53 Mikkel

ES6不支持動態的進口（見Importing modules using ES6 syntax and dynamic path）

然而

，您可以使用CommonJS style requiring in Meteor

所以這樣的事情應該工作使用動態進口：

let collections = ['news', 'comments', ... 'everything']; 

for (let collection of collections) { 
    require(`./${collection}/collection.js`); 
    require(`./${collection}/methods.js`); 
    if (Meteor.isServer) { 
    require(`./${collection}/server/fixtures.js`); 
    require(`./${collection}/server/publications.js`); 
    } 
}

來源

2016-11-28 21:19:55 srtucker22

進口動態不支持。

但是，這看起來像一個反模式。手動加載你的模塊的好處之一（而不是舊式流星'eager loading'）是因爲它是明確的，很容易看到你的輸入代碼來自哪裏。

通過不批量導入所有內容來最小化導入也很重要，以便您可以在代碼中看到依賴關係。

即如果我改變了模塊的API，我可以搜索導入其他模塊和更新

貴公司的所有模塊都需要訪問到所有集合，他們的方法，夾具，出版物？

大部分時間，而不是使用Meteor.isServer您應該將此代碼移動到/server目錄中。當共享代碼時，您可以使用require作爲documented here

還有其他的模式（即代碼分割）可以從動態加載中受益，但我認爲您會更好地考慮最小化導入。

來源

2016-11-28 21:41:07 JeremyK

明白了。謝謝，傑里米。我知道需要語法，並嘗試完全相同的代碼srtucker22下面提供。在這種情況下，我很奇怪無法找到模塊'./news/collection.js'錯誤。 – ivanzolotov

這可能是路徑問題（可能需要的行爲不是導入路徑，而是以不同的方式解析路徑，特別是在需要從導入鏈中調用時）或語法問題與所需文件。我的意思是，我不需要做出一些特殊的出口聲明或使其正常工作？ – ivanzolotov

好吧，你的'import'語句正在被轉換成'require'語句。所有的ES6代碼都被ecmascript包（使用babel）轉換成commonjs，所以用'require'加載一個使用es6'export'語句編寫的模塊不會有任何問題。 – JeremyK

動態進口現在流星1.5

我剛寫了一篇如何做到這一點，更重要的是，何時以及爲什麼這樣做的一篇文章昨日發佈後支持。

https://code.zeroasterisk.com/2017/05/meteor-1-5-bundle-optimization/

TL; DR：import('./my_component')返回一個承諾，當客戶端具有它這樣就解決了。

前：客戶方捆

import PickDates from './PickDates';

的正常進口部分之後：動態導入不再是客戶方包的一部分

import Loader from 'react-loader'; 

// generic loading component to show while transfering section of code 
const LoadingComponent =() => <span className="text-muted"><i className="fa fa-refresh" /></span>; 
// new version of the component, now: loading --> rendered 
const PickDates = Loader({ 
    // this does the dynamic import, and returns a promise 
    loader:() => import('./PickDates'), 
    // this is our generic loading display (optional) 
    LoadingComponent, 
    // this is a delay before we decide to show our LoadingComponent (optional) 
    delay: 200, 
});

來源

2017-06-02 08:26:56 zeroasterisk

如何通過動態路徑與流星

回答

相關問題