webpack 打包报错 The 'mode' option has not been set, webpack will fallback to 'production' for,Module not found: Error: Can't resolve,WARNING in configuration

运行环境:

  • windows
  • nodejs v10.15.3
  • webpack v4.38.0

我先全局安装了 webpack 和 webpack-cli:

npm install -g webpack
npm install -g webpack-cli

然后运行 webpack 去打包时报错:

仔细看 webpack 官网手册发现,从4.0开始,运行 webpack 时一定要加参数 --mode development [开发环境] 或者 --mode production [生产环境] :

不使用配置文件的用法

webpack <entry> [<entry>] -o <output>

<entry>

一个文件名或一组被命名的文件名,作为构建项目的入口起点。你可以传递多个入口(每个入口在启动时加载)。如果传递一个形式为 <name> = <request> 的键值对,则可以创建一个额外的入口起点。它将被映射到配置选项(configuration option)的 entry 属性。

<output>

要保存的 bundled 文件的路径和文件名。它将映射到配置选项 output.path 和 output.filename

示例

webpack --mode development app.js -o bundle.js

如果有配置文件(webpack.config.js),加入 mode 即可。

module.exports = {
mode: 'development'
}

 
再次打包:
 
 

成功!

附:

配置选项

参数 说明 输入类型 默认值
--mode 用到的模式,"development" 或 "production" 之中的一个 string  

webpack打包 The 'mode' option has not been set, webpack will fallback to的更多相关文章

  1. webpack打包The 'mode' option has not been set,错误提示

    学习到webpack打包这个工具的时候,总是报错.在这里记录一下...... 我是window系统 当使用npm安装好webpack后,你去查看如果出现一下问题. 出现以上问题,我的做法是 先将web ...

  2. 笔记:webpack 打包参数 mode development

    webpack 打包参数 mode development 在开发时使用 webpack 打包后不压缩,所以只需要在 webpack 打包命令中加上 --mode mode development 即 ...

  3. 使用express、react、webpack打包、socket.io、mongodb、ant.design、less、es6实现聊天室

    拿到一个项目,我们应该如何去完成这个项目呢. 是直接上手? 还是先进行分析,然后再去解决呢?毫无疑问,如果直接上手解决,那么可能会因为知道目标所在,而导致出现各种问题. 所以,我们应该系统的分析这个项 ...

  4. vue之webpack打包工具的使用

    vue之webpack打包工具的使用 一.什么是webpack? webpack是一个模块打包工具.用vue项目来举例:浏览器它是只认识js,不认识vue的.而我们写的代码后缀大多是.vue的,在每个 ...

  5. vue结合webpack打包问题

    在使用vue开发项目时,如果要使用其单文件组件特性,必然要使用webpack或者其他打包工具打包,这里我用到的是webpack打包,首先是搭建vue环境和webpack环境,在这里遇到的一个问题是在成 ...

  6. webpack打包出现WARNING in configuration The 'mode' option has not been set, webpack will fallback to 'production' for this value. 错误

    打包运行的时候出现以下错误 WARNING in configurationThe 'mode' option has not been set, webpack will fallback to ' ...

  7. vue-cli+webpack打包配置

    vue-cli+webpack打包配置 一: 目录结构: ├── README.md ├── build │ ├── build.js │ ├── check-versions.js │ ├── ut ...

  8. webpack打包优化之外部扩展externals的实际应用

    目录 前言 externals定义 用法 string array object function regex 实际案例 打包时间 打包之后包的大小 浏览器加载 需要注意 参考 前言 使用vue-cl ...

  9. npm run dev--The 'mode' option has not been set, webpack will fallback to 'production' for this value

    npm run dev时报警告: warning configurationThe 'mode' option has not been set, webpack will fallback to ' ...

随机推荐

  1. C#开发微信小程序(三)

    导航:C#开发微信小程序系列 关于小程序项目结构,框架介绍,组件说明等,请查看微信小程序官方文档,关于以下贴出来的代码部分我只是截取了一些片段,方便说明问题,如果需要查看完整源代码,可以在我的项目库中 ...

  2. FCC---CSS Flexbox: Use the flex-direction Property to Make a Row

    Adding display: flex to an element turns it into a flex container. This makes it possible to align a ...

  3. ES6- Class类的使用,声明,继承

    声明一个类 //class 类 class Coder{ // 类中都是方法 函数 //val是name方法的参数 name(val){ console.log(val) //类 return val ...

  4. 基于Moya、RxSwift和ObjectMapper优雅实现REST API请求

    在Android开发中有非常强大的 Retrofit 请求,结合RxJava可以非常方便实现 RESTful API 网络请求.在 iOS开发中也有非常强大的网络请求库 Moya ,Moya是一个基于 ...

  5. 初始 Tronado

    安装 pip 安装 pip install tronado 手动安装 下载tronado安装包(https://pypi.python.org/packages/source/t/tornado/to ...

  6. C++ --const修饰指针

    const修饰指针 1.const修饰指针 (常量指针)常量的指针 const int *p = &a; const修饰的是*p(表示内容为常量),不是p(指针) 指针指向的地址可以改,但指针 ...

  7. composer中常用命令

    一些常用的composer命令: # 显示所有已经安装的包 composer show # 移除指定的依赖包package_name composer remove package_name # 搜索 ...

  8. python-16-初识函数

    前言 以前写的python代码都是像记流水账一样,那么函数时什么额?它可以在任何需要它的地方进行调用,函数分为: 内置函数,print(),len() 自定义函数 一.自定义函数 1.我们都知道内置函 ...

  9. Python Weekly 419

    文章,教程或讲座 如何用 Dropbox Security 构建用于日志系统的威胁检测和事件响应的工具 https://blogs.dropbox.com/tech/2019/10/how-dropb ...

  10. Ubuntu设置开机时启动的系统内核版本

    1.查看系统当前安装的所有内核版本 有两种方法 第一种: 可以查看/lib/modules下的文件夹,一个文件夹对应一个内核版本,如下图: 第二种:使用下面的命令查看: dpkg --get-sele ...