javascript - 如何在 webpack Angular2 中包含外部 javascript 或 css

Question

我正在使用 webpack 启动一个 Angular 2 项目。我正在使用 angular2-webpack-starter https://github.com/AngularClass/angular2-webpack-starter .

我想在我的应用程序中包含外部 javascript 和 css。我检查了一些博客，但发现它们令人困惑。

Answer 1

我猜外部 css 和 js 是指项目中某处下载的文件。如果您已经使用了 webpack 启动种子，那么您很可能在 src/内有一个 asset 文件夹，该文件夹已经设置好供您放置外部 css 和 js 文件并将它们列在 index.html 文件中。

如果没有，如果您想重新开始，请重新下载种子，或者您可以在 src 下创建此文件夹，并将文件包含在 index.html 文件中，例如

<script src="/assets/css/lib.min.css" />
<script src="/assets/js/lib.min.js" />

如果您使用 webpack 进行捆绑，那么您还需要告诉 webpack 将 Assets 文件夹移动到创建位置。在 webpack.config.js 中，您可以执行以下操作:

const CopyWebpackPlugin = require('copy-webpack-plugin');

module.exports = {
    ...
    plugins: [
        new CopyWebpackPlugin([
            { from: 'src/assets', to 'assets' }
        ]),
        ...
}