Webpack2等效的html脚本标签？

我已经下载了该建议添加的NPM模块：Webpack2等效的html脚本标签？

<link href="node_modules/ng2-toastr/bundles/ng2-toastr.min.css" rel="stylesheet" /> 
<script src="node_modules/ng2-toastr/bundles/ng2-toastr.min.js"></script>

要我index.html文件。

有没有一种方法可以要求与来自angular2组件的Webpack 2具有相同的引用？

例如

import 'ng2-toastr.min.js'

in the component？

来源

2016-11-06 George Edwards

说明中给出的建议很奇怪。您不必包含<script>标签，因为您使用的是webpack，该脚本将作为webpack包的一部分自动加载。

至于css，你也可以使用webpack。首先，你需要安装相应的装载机能够加载css文件和应用样式到DOM：

npm install --save style-loader raw-loader

然后在某处你的打字稿文件，你可以这样做：

import 'style!raw!../node_modules/ng2-toastr/ng2-toastr.css'

（请注意，../node_modules的相对路径可能因应用程序中的嵌套级别而异。

style!和raw!前缀是有关webpack to通过“loaeers”处理给定的脚本。

的raw加载器将刚才读的CSS文件是不尝试做任何进一步的处理（可以使用css!加载器，如果你需要做additioanl之类的东西@import从.css文件，但在这种情况下，这不是必要的，所以最简单的是原始装载机。

的style装载机采用由raw加载器加载CSS和编程它适用于当前页面的DOM，它实际上并没有创造一个<style>标签与src="url...."，但它实现这是确保加载的CSS中的样式加载在页面上的重要部分。

如果你需要经常这样做，你可以随时加载器的配置添加到您的webpack.config.js：

module: { 
    loaders: [ 
    {test: /\.tsx?$/, loader: 'ts-loader'}, 
    {test: /\.css$/, loader:'style!raw'} 
    ] 
}

然后，你可以这样做：

import '../node_modules/ng2-toastr/ng2-toastr.css'

来源

2016-11-07 07:58:47 dtabuenc

Webpack2等效的html脚本标签？

回答

相关问题