webpack.config.js
Posted 陆漫漫
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了webpack.config.js相关的知识,希望对你有一定的参考价值。
var path = require(‘path‘); var webpack = require(‘webpack‘); var ExtractTextPlugin = require(‘extract-text-webpack-plugin‘); //定义了一些文件夹的路径 var ROOT_PATH = path.resolve(__dirname,‘src‘); // var APP_PATH = path.resolve(ROOT_PATH, ‘app‘); // var BUILD_PATH = path.resolve(ROOT_PATH, ‘build‘); module.exports = { entry: ROOT_PATH, output:{ path: path.resolve(__dirname, ‘assets‘), filename: ‘bundle.js‘, publicPath: ‘/assets/‘ }, resolve: { extensions: [‘.js‘, ‘.jsx‘ ], }, devServer: { historyApiFallback: true, host: ‘localhost‘, port: ‘9001‘, // hot: true, // inline: true, proxy: { ‘/nmedia‘: { target: ‘http://localhost:8080‘, changeOrigin: true, } } }, devtool: ‘source-map‘, plugins: [ new webpack.DefinePlugin({//指定生产环境,以便在压缩时可以让uglifyjs自动删除代码块的警告语句 ‘process.env.NODE_ENV‘:JSON.stringify(‘production‘) }), new webpack.HotModuleReplacementPlugin(), new ExtractTextPlugin(‘css/styles.css‘), // new webpack.optimize.UglifyJsPlugin({ // comments: false, //去掉注释 // compress: { // warnings: false //忽略警告,不然会有一大推的黄色字体出现 // } // }) ], module: { rules: [ { test: /\.js$/, use: [{ loader: "babel-loader", options: { presets: ["es2015", "stage-0"] } }], include: [path.resolve(__dirname, ‘src‘)] }, { test: /\.html$/, use: ‘raw-loader‘ }, { test: /\.css$/, use: ExtractTextPlugin.extract({ fallback: "style-loader", use: "css-loader" }) }, { test: /\.less$/, use: ExtractTextPlugin.extract({ fallback: ‘style-loader‘, use: [ // activate source maps via loader query { loader: ‘css-loader‘, options: { sourceMap: true, importLoaders: 1 } }, { loader: ‘less-loader‘, options: { sourceMap: true } } ] } )}, ], } }
以上是关于webpack.config.js的主要内容,如果未能解决你的问题,请参考以下文章
webpack教程——webpack.config.js文件
在 vue-cli 3.0 如何生成完整的 webpack.config.js
webpack配置之webpack.config.js文件配置
入口点 - webpack.config.js vs vue.config.js