最近在学习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的更多相关文章

  1. webpack4打包报错ERROR in multi ./src/main.js dist/bundle.js

    webpack打包测试: 上边将mode01.js模块及main.js主文件编写完成,下边使用webpack对这些js文件进行打包 1.进入程序目录,执行webpack main.js build.j ...

  2. 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

  3. webpac4k运行webpack .\src\main.js .\dist\bundle.js打包出错

    打包的命令格式:webpack 要打包的文件的路径  打包好的输出文件的路径 运行webpack .\src\main.js .\dist\bundle.js 提示错误,错误信息如下: WARNING ...

  4. 解决 webpack .\src\main.js .\dist\bundle.js 错误

    打包的命令格式:webpack 要打包的文件的路径 打包好的输出文件的路径 栗子: webpack .\src\main.js .\dist\bundle.js 提示错误,错误信息如下: 错误原因 w ...

  5. 在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 ...

  6. 解决webpack和gulp打包js时ES6转译ES5时Object.assign()方法没转译成功的问题

    在webpack或gulp打包的配置文件中package.json 引入"@babel/plugin-transform-object-assign": "^7.2.0& ...

  7. 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 ...

  8. 解决webpack vue 项目打包生成的文件,资源文件均404问题

    最近在使用webpack + vue做个人娱乐项目时,发现npm run build后,css js img静态资源文件均找不到路径,报404错误...网上查找了一堆解决办法,总结如下 一.首先修改c ...

  9. 解决webpack项目中打包时候内存溢出的bug JavaScript heap out of memory

    vue 项目 npm run dev 的时候一直卡住不动:后来找到报错是 Ineffective mark-compacts near heap limit Allocation failed - J ...

随机推荐

  1. CodeWars上的JavaScript技巧积累

    https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice The sli ...

  2. SolrCloud 5.5.5 + Zookeeper + HDFS使用

    安装sol r 三个节点192.168.1.231,192.168.1.234,192.168.1.235 下载安装包solr.tar.gz 解压 tar -zxvf solr.tar.gz 配置ZK ...

  3. jsp 内置对象---EL

    ServletRequest : java.lang.String      getParameter(java.lang.String name) 返回一个string           对应 n ...

  4. tyvj 1057 金明的预算方案 背包dp

    P1057 金明的预算方案 时间: 1000ms / 空间: 131072KiB / Java类名: Main 背景 NOIP2006 提高组 第二道 描述 金明今天很开心,家里购置的新房就要领钥匙了 ...

  5. js建造者(生成器)模式

    建造者模式将一个复杂对象的构建与它的表示分离,使得同样的构建过程可以创建不同的表示. 在软件系统中,有时需要创建一个复杂对象,并且这个复杂对象由其各部分子对象通过一定的步骤组合而成. 建造者模式类图: ...

  6. 在CentOS6.4中安装配置LAMP环境的详细步骤 - Leroy-LIZH

    本文详细介绍了CentOS6.4系统中安装LAMP服务并对其进行配置的过程,即安装Apache+PHP+Mysql,参照了网上大神的设置,其他Linux发行系统可以参考~ 在本文中部分命令操作需要ro ...

  7. 搜索7--noi1804:小游戏

    搜索7--noi1804:小游戏 一.心得 二.题目 1804:小游戏 查看 提交 统计 提问 总时间限制:  1000ms 内存限制:  65536kB 描述 一天早上,你起床的时候想:“我编程序这 ...

  8. Ubuntu16.04 安装wine下的QQ

    下载连接 wine-qqintl http://www.ubuntukylin.com/application/show.php?lang=cn&id=279 安装步骤 安装依赖库 sudo ...

  9. jq中append()、prepend()、after()、before()的区别详解

    1.append() - 在被选元素的结尾插入内容(内容的结尾,比如说有个a标签,则是在</a>这个标签之前添加东西) 2.prepend() - 在被选元素的开头插入内容(内容的开始,比 ...

  10. 重置Mac账户密码

    前提条件,未开启FileVault. 方法: 开机时按住⌘R进入恢复模式 点菜单命令[实用工具]-[终端] 在终端里输入 resetpassword 回车,或出现重设密码窗口 选中要重设密码的硬盘(如 ...