2016-12-13 530 views
0

我們有一個私有的npm存儲庫,其中我們有一個css文件作爲lib文件夾的一部分。從node_modules導入css文件

當嘗試需要使用

require('<module_name>/lib/abc.css') 

該CSS文件並使用的WebPack加載的是,我得到以下錯誤:

SyntaxError: Unexpected token {

任何幫助,如何將這種文件導入

+0

你的做法是正確的, '需要' 將迫使的WebPack捆綁這個CSS。 你可以提供該CSS和顯示webpack配置你關心的CSS? –

回答

0

我一直在這個問題上堅持了幾天(我是node.js/Meteor/React/JavaScript世界的新手)。我找到了一個使用webpackJS的解決方案。

在我的GitHub repository(提交902c92c)上可以找到我的工作解決方案(適用於應用程序使其易於理解;我只使用硬編碼數據顯示數據網格)。該應用程序被稱爲「reactDataGrid」,它是存儲庫的子文件夾,您只需要在該文件夾中運行「流星」即可。

兩個在我的情況下的關鍵步驟是:

  • 創建.babelrc文件與內容描述here(以及下面複製)。我相信這有助於webpack解析JSX的反應語法。我有一種感覺,這可能是您的問題的關鍵,因爲它被報告爲SyntaxError

.babelrc

{ 
    "presets": [ 
    [ 
     "es2015", 
     { 
     "modules": false 
     } 
    ], 
    "react" 
    ] 
} 
  • require('react-datagrid/index.css')聲明我main.jsx文件,告訴的WebPack包括在我的應用程序的依賴關係樹CSS文件中。這實際上是在zippyui/react-datagrid GitHub存儲庫的自述文件中描述的指令。 (遺憾的是計算器限制在我的崗位兩個環節,所以我不能在這裏再聯繫吧)

我不能保證這是首選做的方法,但我可以說,我的作品。我希望它有幫助。

最佳, 凱文