Webpack中入口的index.html中script标签的js如何打包？

Question

webpack构建一个angular项目，入口文件为index.html
里面用了script标签 引入<script>../public/js/main.js</script>的静态标签
在生产者模式时，这些js和相关的png不会打包到dist文件夹中。

即访问localhost:xxxx时会出现访问../public/js/main.js 404的错误。请问如何解决

---

var webpack = require('webpack');
var webpackMerge = require('webpack-merge');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var commonConfig = require('./webpack.common.js');
var helpers = require('./helpers');

const ENV = process.env.NODE_ENV = process.env.ENV = 'production';

module.exports = webpackMerge(commonConfig, {
  devtool: 'source-map',

  output: {
    path: helpers.root('dist'),
    publicPath: '/',
    filename: '[name].[hash].js',
    chunkFilename: '[id].[hash].chunk.js'
  },

  htmlLoader: {
    minimize: false // workaround for ng2
  },

  plugins: [
    new webpack.NoErrorsPlugin(),
    new webpack.optimize.DedupePlugin(),
    new webpack.optimize.UglifyJsPlugin({ // https://github.com/angular/angular/issues/10618
      mangle: {
        keep_fnames: true
      }
    }),
    new ExtractTextPlugin('[name].[hash].css'),
    new webpack.DefinePlugin({
      'process.env': {
        'ENV': JSON.stringify(ENV)
      }
    })
  ]
});

Answer 1

可以用file-loader一个一个将这些文件搬到你指定的目录，require得到的路径回填到<script>就OK了，还有不明白就看这篇文章吧：《webpack多页应用架构系列（六）：听说webpack连图片和字体也能打包？》