在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問(wèn)答/HTML/ webpack 打包 路徑引入不對(duì)

webpack 打包 路徑引入不對(duì)

圖片描述

目錄結(jié)構(gòu)如上圖,在打包后,插入的JS 是相對(duì)于dist這個(gè)目錄圖片描述

完成配置

const htmlWebpackPlugin = require('html-webpack-plugin')
const CleanWebpackPlugin = require('clean-webpack-plugin')
const webpack = require('webpack')
const path = require('path')
const glob = require('glob')

let entries = {}
let HTMLPlugins = []

function getEntry (globPath) {
  glob.sync(globPath).forEach(entry => {

    let nType = entry.split('/')[2]
    entries[nType] = entry

    const htmlPlugin = new htmlWebpackPlugin({
      filename: `${nType}/index.html`,
      template: path.resolve(__dirname, `../src/${nType}/index.html`),
      chunks: [`${nType}`]
    })

    HTMLPlugins.push(htmlPlugin)

  })

}

getEntry('./src/**/js/index.js')

const config = {
  entry: entries,
  devtool:"cheap-module-source-map",
  output: {
    filename:'[name]/js/[name].js',
    path: path.join(__dirname, '../dist'),
    publicPath:'./'
  },

  module: {
    rules: [
      {
        test: /\.js$/,
        use: {
          loader: 'babel-loader',
          options: {
            presets: ['env']
          }
        }
      }
    ],
  },
  plugins: [
    new CleanWebpackPlugin(["./dist"]),
    new webpack.optimize.UglifyJsPlugin(),
    ...HTMLPlugins
  ],
  externals: {
    jquery: 'src/home/js/jquery-1.9.1.min'
  }
}

module.exports = config

提這個(gè)問(wèn)題的前提是:一個(gè)項(xiàng)目里有多個(gè)多個(gè)獨(dú)立的小項(xiàng)目,按所寫(xiě)的webpack去打打包造成資源引入路徑不對(duì)

回答
編輯回答
奧特蛋
filename: `${nType}/index.html`

改成

filename: `./index.html`

試試

2018年2月22日 14:22