zoukankan      html  css  js  c++  java
  • webacp4.0

    'use strict';
    const path = require('path');

    var APP_PATH = path.resolve(__dirname, 'src');
    const webpack = require('webpack');
    const HtmlWebpackPlugin = require('html-webpack-plugin');
    const CleanWebpackPlugin = require('clean-webpack-plugin');

    // const autoprefixer = require('autoprefixer');


    const ENV = process.env.npm_lifecycle_event;
    const isProd = ENV === 'build';

    module.exports = function () {
    const config = {

    mode:'development',
    devtool : 'module-source-map',

    context: path.resolve(__dirname, 'src'),

    entry: {
    'app': path.resolve(APP_PATH ,'index.js'),
    //
    // 'vendor': [
    // 'angular',
    // '@uirouter/angularjs',
    // // 'angular-resource',
    // // 'mobile-angular-ui',
    // // 'ng-dialog',
    // // 'ngtouch',
    // // 'angular-ui-utils',
    // // 'moment',
    // // 'baidumap',
    //
    // ]
    },
    output: {
    path: path.resolve(__dirname,'dist'),
    publicPath: '/',
    filename: isProd ? '[name].[hash:8].js' : '[name].bundle.js',
    chunkFilename: isProd ? '[name].[hash:8].js' : '[name].bundle.js'
    },
    module: {

    rules: [
    {
    test: /.js$/,
    exclude: '/node_modules/',
    use: {
    loader: 'babel-loader'
    }
    },

    {
    test: /.css$/,
    use: ['style-loader', 'css-loader']
    },


    {test: /.html$/, loader: 'raw-loader'},

    {
    test: /.(png|jpg|gif)$/,
    use: [
    {
    loader: 'url-loader',
    options: {
    limit: 8192
    }
    }
    ]
    }

    ]

    },
    optimization: {
    runtimeChunk: {
    name: "manifest"
    },
    splitChunks: {
    cacheGroups: {
    commons: {
    test: /[\/]node_modules[\/]/,
    name: "vendor",
    chunks: "all"
    }
    }
    },
    },

    plugins: [


    new HtmlWebpackPlugin({
    template: path.resolve( APP_PATH, 'index2.html'),
    //inject : 'body',
    chunks: ['commons.chunk', 'vendor', 'app'],
    chunksSortMode: 'dependency'
    }),
    new CleanWebpackPlugin(['dist']),

    ],


    devServer: {
    contentBase: 'src',
    historyApiFallback: true,
    port: 7070
    },
    resolve: {
    alias: {
    _components: path.resolve(APP_PATH, 'components'),
    _config: path.resolve(APP_PATH, 'config'),
    _assets: path.resolve(APP_PATH, 'assets'),
    _pages: path.resolve(APP_PATH, 'pages'),
    _services: path.resolve(APP_PATH, 'services')
    }
    }
    };

    return config;
    }();

  • 相关阅读:
    浅谈MIPS地址对齐问题
    一些使用的linux库
    linux curl网络库的使用方法
    一些json在js和c++ jsoncpp的操作
    Java开发小技巧(六):使用Apache POI读取Excel
    Java开发小技巧(五):HttpClient工具类
    vue-router 组件复用问题
    Vuejs之开发环境搭建
    Java开发小技巧(四):配置文件敏感信息处理
    Java开发小技巧(三):Maven多工程依赖项目
  • 原文地址:https://www.cnblogs.com/qiqi105/p/8645461.html
Copyright © 2011-2022 走看看