html5 - webpack打包js后,手机上报错:webpackJsonp is not defined
本文介绍了html5 - webpack打包js后,手机上报错:webpackJsonp is not defined的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
在用MUI和Hbuilder做一个app时,开发中用webpack打包,刚开始没有用CommonsChunkPlugin提取common.js,今天用CommonsChunkPlugin提取出common.js之后,浏览器正常,但手机上测试就报错。
浏览器没有问题,
手机上运行报错: Uncaught ReferenceError: webpackJsonp is not defined
网上说是common.js没有加载,但是为什么浏览器和手机上测试会有区别,该如何解决?
页面引入js如下:
...
<script src="../dist/common.js"></script>
<script src="../dist/attention.bundle.js"></script>
webpack.config.js
var webpack=require('webpack');
var vue=require('vue-loader');
var path = require('path');
var devServer=require("webpack-dev-server");
module.exports={
//页面入口文件配置
entry:{
newsList:"./js/news/list_entry.js",//新闻
newsPage:"./js/news/page_entry.js",//新闻详情页
weather:"./js/weather/weather_entry.js",//天气
monitor:"./js/monitor/monitor_entry.js",//监测
attention:"./js/attention/att_entry.js"
},
output:{
path:"dist",
filename:"[name].bundle.js",
publicPath: "/"
},
watch: true,
resolve: {
extensions: ['', '.js', '.vue'],
alias: {
components: path.join(__dirname, './src/components')
}
},
plugins:[
new webpack.optimize.CommonsChunkPlugin("common.js",["monitor","attention"])
],
module:{
loaders:[
{test:/\.css$/,loader:'style!css!'},
{test:/\.scss/,loader:'style!css!sass'},
{test: /\.(jpg|png)$/, loader: "url?limit=8192&name=../[path]/[name].[ext]"},
]
}
}
解决方案
webpack配置文件中的 CommonsChunkPlugin 配置贴出来看看。应该是少了webpack的启动文件。
如果配置是大致下面的形式:
...
new webpack.optimize.CommonsChunkPlugin(
{names: ["common", "webpackAssets"]}
),
...
那么页面中还需要将‘webpackAssets’(名称不固定)文件引入到页面中,并且这个文件一定要放在其他js前引用!
这篇关于html5 - webpack打包js后,手机上报错:webpackJsonp is not defined的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文