解决webpack因新版本打包失败问题--ERROR in multi ./src/main.js ./dist/bundle.js
最近在学习webpack打包过程中遇到的一个问题向大家分享下!
创建了一个webpacksty的目录,目录下放着dist,src子目录,然后通过node环境下,npm init -y 初始化项目出现package.json文件,src子目录下又存放着index.html和main.js文件,接下来尝试着在main.js输入一句代码当验证打包后续是否成功的过程:
console.log("ok");
接下就是执行webpack打包命令了
把src下的main.js打包到dist下的bundle.js,执行命令:
webpack .\src\main.js .\dist\bundle.js
执行后:

报错了!此时也可以直接看出我的webpack版本号:4.30.0 ,算是新版本了。
当然此时查看结构目录下dist肯定没有bundle.js的文件出现,然后自己也是看别人的博客查询到了原来是版本过高,以前的命令已经不适用了,只要加-o就轻松解决原来。
webpack .\src\main.js -o .\dist\bundle.js
此时就执行成功了!

在dist目录下也自动生成了bundle.js的文件。
然后在index.html导入这个生成的文件,运行在浏览器查看

打包成功!
有人会问,解决办法的博客这么多,你为什么不在出问题的时候看别人的博客解决问题或者是转载别人的,但是我自己坚持只有你真正动手了才会印象更深刻,开发这条路容不得偷懒,想要不被这个时时刻刻都在技术变更的时代不被淘汰,那就努力吧!一个小小的问题别嫌它小,小也有小的解决办法!加油!
解决webpack因新版本打包失败问题--ERROR in multi ./src/main.js ./dist/bundle.js的更多相关文章
- webpack4打包报错ERROR in multi ./src/main.js dist/bundle.js
webpack打包测试: 上边将mode01.js模块及main.js主文件编写完成,下边使用webpack对这些js文件进行打包 1.进入程序目录,执行webpack main.js build.j ...
- webpack打包错误 ERROR in multi ./src/main.js ./dist/bundle.js
webpack打包错误 ERROR in multi ./src/main.js ./dist/bundle.js:https://www.jianshu.com/p/a55fb5bf75e1
- webpac4k运行webpack .\src\main.js .\dist\bundle.js打包出错
打包的命令格式:webpack 要打包的文件的路径 打包好的输出文件的路径 运行webpack .\src\main.js .\dist\bundle.js 提示错误,错误信息如下: WARNING ...
- 解决 webpack .\src\main.js .\dist\bundle.js 错误
打包的命令格式:webpack 要打包的文件的路径 打包好的输出文件的路径 栗子: webpack .\src\main.js .\dist\bundle.js 提示错误,错误信息如下: 错误原因 w ...
- 在Visual Studio Code 运行 webpack ./src/main.js --output-filename ./dist/bundle.js --output-path . --mode development 提示 Module no t found:Error:Can't resolve' 'jquery' 是因为vs code还没安装jquery
在Visual Studio Code 运行 webpack ./src/main.js --output-filename ./dist/bundle.js --output-path . --mo ...
- 解决webpack和gulp打包js时ES6转译ES5时Object.assign()方法没转译成功的问题
在webpack或gulp打包的配置文件中package.json 引入"@babel/plugin-transform-object-assign": "^7.2.0& ...
- error: js/dist/app.js from UglifyJs Unexpected token: name (Dom7)
What you did I have installed Swiper as normal dependency in my Project and import it to my scripts ...
- 解决webpack vue 项目打包生成的文件,资源文件均404问题
最近在使用webpack + vue做个人娱乐项目时,发现npm run build后,css js img静态资源文件均找不到路径,报404错误...网上查找了一堆解决办法,总结如下 一.首先修改c ...
- 解决webpack项目中打包时候内存溢出的bug JavaScript heap out of memory
vue 项目 npm run dev 的时候一直卡住不动:后来找到报错是 Ineffective mark-compacts near heap limit Allocation failed - J ...
随机推荐
- RabbitMQ解决分布式事务
案例:经典案例,以目前流行点外卖的案例,用户下单后,调用订单服务,让后订单服务调用派单系统通知送外卖人员送单,这时候订单系统与派单系统采用MQ异步通讯. RabbitMQ解决分布式事务原理: 采用最终 ...
- js,java,ajax实现跨域访问及其原理
http://blog.csdn.net/saytime/article/details/51540876 这篇文章对跨域访问做了较为细致得分析,我这里做下简单总结 1.实现跨域访问原理: 浏览器由于 ...
- [转载]Struts2.1.6+Spring2.5.6+Hibernate3.3.
原文地址:Struts2.1.6+Spring2.5.6+Hibernate3.3.1全注解实例详解(一)(转载大象)作者:沉睡森林 在JavaEE企业级开发中,以SSH2框架为核心的应用非常广,大 ...
- matlab学习笔记,图像分块
clc; clear all; close all; I = imread('E:\matlab\files-images\tomsen512.jpg'); rs = size(I, 1);% 行数c ...
- PrintWriter的使用
java.io.PrintWriter 具有自动行刷新的缓冲字符输出流,特点是可以按行写出字符串,并且可以自动行刷新. java.io.BufferedWriter是缓冲字符输出流,内部有缓冲区可以进 ...
- 智课雅思词汇---十五、前缀co-com-con-col-cor-是什么意思
智课雅思词汇---十五.前缀co-com-con-col-cor-是什么意思 一.总结 一句话总结:前缀:co- 表示"共同", 通常放在元音词根前 1.前缀co-com-con- ...
- 02-大鸭梨博客系统数据库设计及Dapper的使用
毫无疑问,数据库的设计在一个系统中起了至关重要的作用.我们都知道,系统设计分为两部分,或者说是两个阶段,即数据库设计和功能设计.构建一个完善的系统需要这两个阶段的充分考量.周密设计.合理联接以及密切配 ...
- ItemsControl 与 ICollectionView
ItemsControl base class can automatically interact with ICollectionView classes
- Deep Learning(Ian Goodfellow) — Chapter1 Introduction
Deep Learning是大神Ian GoodFellow, Yoshua Bengio 和 Aaron Courville合著的深度学习的武功秘籍,涵盖深度学习各个领域,从基础到前沿研究.因为封面 ...
- hdu 1536/ hdu 1944 S-Nim(sg函数)
S-Nim Time Limit: 5000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Submi ...