我们试图用webpack而不是gulp服务运行Angular js应用程序 . HTMLWebPack插件在dist文件夹中生成Index.html，其中包含脚本标记中的 app.bundle.js .

webpack-config.js

const path = require('path');
var HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
  entry: './src/app/app.js',    
  module: {
    rules: [
        {
            test: /\.js$/,
            exclude: /node_modules/,
            loader: 'babel-loader', 
            query: {
                presets: ['es2015']
            }
        },
      {     test: /\.css$/, loader: "style!css" }
     ]
  },

 output: {
          path: path.join(process.cwd(), 'dist'),
          publicPath: 'dist/',
          filename: 'app.bundle.js'
        },
          plugins: [new HtmlWebpackPlugin()],
          devtool: "#inline-source-map"
};

index.html （在src文件夹中）

<!DOCTYPE html>
<html class="no-js" ng-app="Module" ng-controller="appController">
<head>
    <link rel="shortcut icon" href="/favicon.ico?" type="image/vnd.microsoft.icon" id="favicon" />
    <meta charset="utf-8">
    <title>Application</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width">
    <base href="/">
</head>
<body ng-class="themeClass">
    <div id="container" ui-view></div>
</body>
</html>

index.html （在dist文件夹中生成）

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Webpack App</title>
    </head>
    <body>
        <script type="text/javascript" src="dist/app.bundle.js"></script>
    </body>
</html>

dist index.html 未加载src中存在的 index.html 中存在的控制器标签等，并且空白页面将出现在浏览器中 . 我的 app.js 拥有控制器的所有定义 .

angular webpack