javascript - webpack 打包问题
本文介绍了javascript - webpack 打包问题的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
问 题
webpack配置出现问题，配置文件output项没有生效，
var webpack = require("webpack");
var path = require("path");
var DEV = path.resolve(__dirname, "dev");
var OUTPUT = path.resolve(__dirname, "output");
module.exports = {
//入口文件 可以是数组，字符串，对象。入口不唯一，可能有多入口，数组以最后一个为准，
//对象的话名称要唯一，输出 '[name].js'
entry: DEV + "/index.js",
//输出路径 唯一
output: {
path: path.resolve(__dirname, "output"),
filename: "bundle.js"
},
//模块选项
module: {
loaders: [
{
test: /\.js$/, //满足条件的
exclude: /node_modules/, //不满足条件的
loader: 'babel-loader',
include: DEV
}
]
},
resolve: {
extensions: ['','.js','.jsx']
}
};
webpack-dev-server --inline --content-base dev/
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Webpack exercise</title>
</head>
<body>
<div id="container"></div>
</body>
<script src="bundle.js"></script>
</html>
文件夹结构
output 文件夹目录下没有输出 bundle.js ,导致index.html 引入的时候<script src="/output/bundle.js"></script> 找不到文件， bundle.js为什么没有打包到 output文件夹下?
解决方案
webpack-dev-server输出的文件在内存里，浏览器可以通过publicPath设置的目录访问，不设置则为根目录。webpack打包输出文件才会在path目录下
这篇关于javascript - webpack 打包问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
