webpack.config.js文件

转载于 2019-06-05 15:56:00 发布 · 62 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/shangjun6/p/10980093.html

文章标签：

#webpack #json #ViewUI

本文详细介绍了Webpack的基本配置方法，包括入口文件、输出设置、加载器、插件等关键配置项。展示了如何使用Babel进行JS转换，如何加载CSS、JSON及图片资源，并启用了浏览器自动打开功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

与 package.json 配合使用

var path=require("path");
var OpenBrowserPlugin = require('open-browser-webpack-plugin');
module.exports={
    entry:"./index.js",
    output:{
        path:path.resolve(__dirname,__dirname),　　　
        filename:"blund.js"
    },
    module:{
        loaders:[
            {
                test:/\.css$/,
                loader:"style-loader!css-loader"
            },
            {
                test: /\.json$/,
                loader: 'json-loader'
            },
            {
                test: /\.(png|jpg|gif)$/i,
                loader: 'url-loader',
                options: {
                    limit: 8192
                }
            },
            {
                test: /\.m?js$/,
                exclude: /(node_modules|bower_components)/,
                loader: 'babel-loader',
                options: {
                    presets: ['@babel/preset-env']
                }
            }
        ]
    },
    plugins:[
        new OpenBrowserPlugin({ url: 'http://localhost:8080' })
    ],
    devServer:{
        port:8080
    }
};