Angular2：如何从node_modules导入样式表？

Question

问题：在我的Angular2（4.0）应用程序中，如何从node_modules中的模块导入样式表（css）？

我有一个模块位于：

node_modules/@swimlane/ngx-datatable 

我想导入样式表：

node_modules/@swimlane/ngx-datatable/release/index.css 

我尝试以下方法，没有运气：

在我的组件自己的scss文件中：

@import '~@swimlane/ngx-datatable/release/index.css'; 

在我的组件：

@Component({ 
    encapsulation: ViewEncapsulation.None, 
    selector: 'site_table', 
    template: require('./site_table.html'), 
    styleUrls: ['./site_table.scss', '@swimlane/ngx-datatable/release/index.css'] 
}) 

Answer 1

因为你已经使用SCSS，在./site_table.scss进口它像这样

@import "~swimlane/ngx-datatable/release/index"; 

注：不添加扩展名。

它将从节点包中导入样式表。这让我很满意，希望它也能为你效劳。这样你只需要在你的组件中使用单个样式表，它会看起来更干净。

Answer 2

了一个完整的相对URL试试：

@Component({ 
    encapsulation: ViewEncapsulation.None, 
    selector: 'site_table', 
    template: require('./site_table.html'), 
    styleUrls: [ 
      './site_table.scss', 
      '../../node_modules/@swimlane/ngx-datatable/release/index.css' 
    ] 
}) 

没试过你的符号，但节点封装的分辨率，不的WebPack可能无法正常工作。但我可能是错的。