【转】webpack4

1、不再支持node.js4.X

2、不能用webpack命令直接打包指定的文件,只能使用webpack.config.js进行配置。

     即:webpack  demo01.js  bundle01.js 不能用了。

3、CLI被移动到了一个专门的包 webpack-cli里了。

      全局安装webpack-cli

      命令:npm install webpack-cli -g

4、本地(项目目录)下安装webpack,

     命令:npm install webpack -D

5、在webpack.config.js里的配置,不再支持 module下的loaders,需要把loaders改成rules。

    如下:

    module: {

        rules: [
            //针对css文件,进行对应的loader处理
            { test: /\.css$/, loader: "style-loader!css-loader" }
        ]

    }

 

7、json

        webpack 现在能原生地处理 JSON

        允许通过 ESM 语法导入 JSON

8、优化:

       更新 uglifyjs-webpack-plugin 至 v1 版本,以支持 ES2015

9、Usage

      现在可以在两种模式中选择 (mode or --mode) : 生产模式或开发模式

10、配置:

       NoEmitOnErrorsPlugin -> optimization.noEmitOnErrors (生产模式下默认开启)
       ModuleConcatenationPlugin -> optimization.concatenateModules (开发模式下默认开启)
       NamedModulesPlugin -> optimization.namedModules (开发模式下默认开启)
       CommonsChunkPlugin 已被移除 -> optimization.splitChunks, optimization.runtimeChunk

11、Syntax

        import() 总是返回一个命名空间对象。CommonJS 模块被封装到默认导出中

12、还有一个坑,暂时还没有解决,正在研究:

        用 import Vue from "vue";  引入vue有问题,

        但是改成   

             import Vue from "vue/dist/vue.js"; 

        是可以用的。

posted @   Sameen  阅读(118)  评论(0编辑  收藏  举报
编辑推荐:
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
阅读排行:
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
点击右上角即可分享
微信分享提示