本文介绍了webpack如何将首页打包到根目录而不是打包到build?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
现在我的文件全部都是打包到build中,但是index.html应该是单独打包到根目录而不是build中,请问这个问题如何解决
配置文件:var path = require('path');var webpack = require('webpack');var HtmlwebpackPlugin = require('html-webpack-plugin');var ROOT_PATH = path.resolve(__dirname);var APP_PATH = path.resolve(ROOT_PATH, 'src');var BUILD_PATH = path.resolve(ROOT_PATH, 'build');var TEM_PATH = path.resolve(ROOT_PATH,'templates');module.exports = {
entry : { main : APP_PATH + '/js/main.js', vendors : ['jquery','moment'] }, devtool: 'eval-source-map', output : { path : BUILD_PATH, filename : '[name].js' }, devServer: { hot: true, inline: true, progress: true, port : 7777, proxy :{ '/itemCategory/*':{ target : 'localhost:8082', secure : false } } }, module :{ loaders:[ { test: /\.css$/, loaders: ['style', 'css'], include : APP_PATH }, { test: /\.(png|jpg)$/, loader: 'url?limit=4000000' } ] }, plugins : [ new HtmlwebpackPlugin({ title : '澳門記憶', template : path.resolve(TEM_PATH,'index.html'), chunks : ['main','vendors'],//这个插件告诉插件需要引入哪几个入口文件 inject: 'head',//插入到body hash: true }), new webpack.ProvidePlugin({ $: "jquery", jQuery: "jquery", "window.jQuery": "jquery" }),//全局js new webpack.optimize.UglifyJsPlugin({minimize: true}),//代码压缩 new webpack.optimize.CommonsChunkPlugin('vendors', 'vendors.js')//将入口文件的vendors打包成vendors.js ]}
这是我希望打包后index.html出现的位置
解决方案html-webpack-plugin也没有能重置输出路径的参数呢,看来是只能把output.path参数设为你现在的根目录,然后在所有其它资源的路径上加上build/这一级目录呗。
其实我认为根本不需要做什么改动,index.html放在build目录里是最好不过的,你只要部署的时候把build目录作为网站根目录就完事了。
更多推荐
webpack如何将首页打包到根目录而不是打包到build?
发布评论