2016-04-21 56 views
0

我的應用程序是使用Webpack + Babel編譯的React JSX/ES6。我的測試套件是Tape + Shallow Render,到目前爲止,我已經能夠通過babel-node(和babel-istanbul)運行所有內容,而無需運行Webpack和瀏覽器或無頭瀏覽器。排除導入w/Babel?

然後我需要一個資產。 A .mp3,具體說明。

我所擁有的主要是:

import ding from '/sounds/ding.mp3'; 
... 
<audio src={ding} autoPlay={true} /> 

這適用於開發和生產,但沒有的WebPack(和file-loader),它被絆倒:

/Users/orbiteleven/project/client/sounds/ding.mp3:1 
(function (exports, require, module, __filename, __dirname) { ID3 
                   ^
SyntaxError: Unexpected token ILLEGAL 

是否有辦法通過Babel(或其他方法)排除進口? ignore並沒有這樣做,因爲它只是阻止Babel解析文件,但包含它。

我喜歡不必包括像Karma + PhantomJS/Chrome/Electron/Whatever這樣的複雜性(和緩慢)。

回答

0

將導入更改爲像import ding from '../sounds/ding';這樣的格式。在那裏建立一個名爲ding.js的模塊(基本上是noop模塊),並在webpack的一側使用resolve.alias將導入映射到mp3文件。你會以

resolve: { 
    alias: { 
    '../sounds/ding': PATHS.ding 
    } 
}