zoukankan      html  css  js  c++  java
  • webpack 配置

    var webpack = require('webpack');
    var path = require('path');
    var autoprefixer = require("autoprefixer");
    var ExtractTextPlugin = require('extract-text-webpack-plugin');//css样式从js文件中分离出来,需要通过命令行安装 extract-text-webpack-plugin依赖包
    // var HtmlWebpackPlugin = require('html-webpack-plugin');
    
    module.exports = {
        devtool: 'source-map',
    
        entry: {
            'index': path.join(__dirname , "src/index.js"),
            'page1': path.join(__dirname , "src/page1.js"),
            'vendor': ["jquery"]
        }, //已多次提及的唯一入口文件,可以打包多个文件
    
        output: {
            path: path.join(__dirname , "dist"), //打包后的文件存放的地方
            filename: "[name].js" //打包后输出文件的文件名
        },
    
        // externals: {
        //     jquery: 'jQuery'
        // },
    
        module: {
            rules: [
                {
                    test: /.css$/,
                    use: ExtractTextPlugin.extract({
                        fallback: "style-loader",
                        use: "css-loader!postcss-loader",
                        publicPath: "../" //css图片路径出错
                    })
                },
                {
                    test: /.(png|jpg)$/,
                    loader: 'url-loader?limit=8192&name=./images/[hash:8].[name].[ext]'
                },
                {
                    test: /.js$/,
                    exclude: /(node_modules)/,
                    loader: "babel-loader"
                },
                {
                    test: /.json$/,
                    loader: "json-loader"
                }
            ]
        },
        plugins: [
            new ExtractTextPlugin({
                filename: "./css/[name].css",
                allChunks: true
            }),
    
            require('autoprefixer'),
    
            new webpack.optimize.CommonsChunkPlugin({
                name: ['vendor'] // 指定公共 bundle 的名字。
            }),
    
            // new HtmlWebpackPlugin({
            //     filename: "./public/index.html",
            //     template: "./html/moban.html",
            //     inject: true,
            //     hash: true,
            //     // minify:
            // }),
            
            // new webpack.optimize.UglifyJsPlugin({
         //      compress: {
         //        warnings: false
         //      }
         //    }),
        ]
    }
  • 相关阅读:
    图形与文本
    Cookie处理函数练习
    jspSmartUpload上传下载全攻略
    SmartUpload 上传图片
    无下拉菜单
    servlet中使用SmartUpload组件实现上传
    乱码
    DIV+CSS 要兼容 IE8.0 应注意些什么?
    虚拟目录中的web.config不被上级目录的web.config影响的处理
    ASP.NET抓取页面源代码
  • 原文地址:https://www.cnblogs.com/yghgo/p/6845483.html
Copyright © 2011-2022 走看看