Angular 2 webpack Systemjs.config.js腳本和css問題

我想使用webpack將我的angular2應用程序移動到Production。Angular 2 webpack Systemjs.config.js腳本和css問題

<!DOCTYPE html> 
<html> 
<head> 
    <title>iPage Quick Order</title> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" type="text/css" href="mystyle.css"> 
    <link rel="stylesheet" type="text/css" href="Stylesheet.css"> 
    <script src="node_modules/core-js/client/shim.min.js"></script> 
    <script src="node_modules/reflect-metadata/Reflect.js"></script> 
    <script src="node_modules/zone.js/dist/zone.js"></script> 
    <script src="node_modules/systemjs/dist/system.src.js"></script> 
    <script src="src/script/systemjs.config.js"></script> 
    <script src="node_modules/ng2-bs4-modal/bundles/ng2-bs4-modal.js"></script> 
    <script src="node_modules/jquery/dist/jquery.min.js"></script> 
    <script src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script> 
    <script> 
     System.import('src/source/app/bootstrap/main').catch(function(err){ console.error(err); }); 
    </script> 
</head> 
<body> 
    <my-app>Loading...</my-app> 
</body> 
</html>

我的問題是，如何將CSS和JS文件添加到網絡包因爲在PROD模式時，出現錯誤，即CSS和JS文件未找到。

來源

2016-12-31 Vicky3D

您可以使用「HtmlWebpackPlugin」，看看下面的例子：

//First import this package 

    import HtmlWebpackPlugin from 'html-webpack-plugin'; 

    //Then add this plugin 

    plugins: [ 
     // Create HTML file that includes reference to bundled JS. 
     new HtmlWebpackPlugin({ 
      template: 'src/index.html', 
      inject: true, 
     }) 
     ]

從https://angular.io/docs/ts/latest/guide/webpack.html#!#loaders網站：

的WebPack產生了一些JS和CSS文件。我們可以手動將它們插入到我們的index.html中。這將是乏味和容易出錯的。 Webpack可以使用HtmlWebpackPlugin爲我們注入這些腳本和鏈接。

來源

2016-12-31 22:40:00 user6801750

Angular 2 webpack Systemjs.config.js腳本和css問題

回答

相關問題