loader种类loader分为四类分别是:前置 pre行内 inline普通 normal后置 postRule.enforceenforce 属性会影响 loader 种类。不论是普通的,前置的,后置的 loader。可能的值有:"pre" | "post"module: {    rules: [      {        test: /\.less$/, ...            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-11-23 00:08:24
                            
                                52阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            极简入门webpack什么是模块?程序员将不同的功能的程序分为不同的模块。模块的特点: 使代码有            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-08-05 15:58:09
                            
                                96阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            webpack升级到4.0.1,执行webpack命令报错: 按错误提示,webpack单独分离出了wepack-cli,需要我们安装wepack-cli。 全局安装: 全局安装webpack-cli后,使用webpack -v成功。 在项目本地安装webpack,webpack-cli:            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2018-04-07 14:38:00
                            
                                171阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            在本次Wepack 4教程,我们会聚焦通过压缩输出内容,来提升你应用的用户体验。这意味着,生            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2022-05-20 10:28:10
                            
                                55阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            第一步安装npmi-Dserviceworker-webpack-plugin。第二步:编写wepack.config.js如下constpath=require('path');constExtracTextPlugin=require('extract-text-webpack-plugin')const{WebPlugin)=require(’web-webpack-plugin’);con            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2020-10-17 20:39:31
                            
                                1490阅读
                            
                                                        
                                点赞
                            
                                                                             
                 
                
                             
         
            
            
            
            #原因 webpack经常出现版本不兼容问题,vue-loader在15以前的版本打包时候会自动生成VueLoaderPlugin,但是现在需要手动去wepack.config.js文件中去加入,如下图所示 const VueLoaderPlugin = require('vue-loader/li ...            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2021-08-05 11:03:00
                            
                                2269阅读
                            
                                                                                    
                                2评论
                            
                                                 
                 
                
                             
         
            
            
            
            在本次Wepack 4教程,我们会聚焦通过压缩输出内容,来提升你应用的用户体验。这意味着,生产环境需要一套不同的做法。今天,我们将通过mode参数来讲述Webpack内置的优化功能。开始吧!            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2019-03-01 14:34:54
                            
                                645阅读
                            
                                                        
                                点赞
                            
                                                                             
                 
                
                             
         
            
            
            
            一、前言
webpack.dev.conf.js 配置文件是vue开发环境wepack相关配置文件。
// 引入当前目录中的utils工具配置文件
var utils = require('./utils')
// 引入webpack来使用webpack内置插件
var webpack = require('webpack')
// 引入config目录中的index.js配置文件
var con            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2023-04-11 08:42:06
                            
                                124阅读
                            
                                                        
                                点赞
                            
                                                                                    
                                1评论
                            
                                                 
                 
                
                                
                     
                                    
                             
         
            
            
            
            webpack配置1. 安装安装nodejs,运行命令npm intall wepack –g 或者npm install webpack –save-dev进行全局和本地安装。安装指定版本,运行命令npm install webpack@1.12.x --save-dev如果需要使用webpack开发工具,请自行安装npm install webpack-dev-server            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-02-11 17:45:45
                            
                                164阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            webpack配置1. 安装安装nodejs,运行命令npm intall wepack –g 或者npm install webpack –save-dev进行全局和本地安装。安装指定版本,运行命令npm install webpack@1.12.x --save-dev如果需要使用webpack开发工具,请自行安装npm install webpack-dev-server            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2021-08-02 14:55:59
                            
                                271阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            使用的webpack版本是 3.10.0demo的目录结构:dist     
  |--    //用来存放打包后的文件   
src 
  |--asset  //存在需要打包的插件   
  |--page  //存放入口文件以及模板文件开始demo之前的一些准备:**1.创建一个目录my_demo,进入当前目录下,初始化一个package.jsonnpm init2.安装我们的wepack            
                
         
            
            
            
            一、前言
webpack.base.conf.js 文件是vue开发环境和生产环境wepack相关配置文件,主要用来处理各种文件的配置。
// 引入nodejs路径模块
var path = require('path')
// 引入utils工具模块,utils主要用来处理css-loader和vue-style-loader的
var utils = require('./utils')
//            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2023-04-10 10:17:21
                            
                                83阅读
                            
                                                        
                                点赞
                            
                                                                                    
                                1评论
                            
                                                 
                 
                
                                
                     
                                    
                             
         
            
            
            
            文章目录三大框架数据绑定和数据流vue的安装wepack初始化vue项目vue脚手架初始化项目(推荐)应用实例和组件实例MVCMustache{{}}v-bindv-onv-once、${}v-htmlv-if、v-elsev-showdatamethodslodash计算属性computed计算属性数组语法Style绑定对象语法数组语法Class和Style的实现templatev-for数组            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-07-12 01:13:48
                            
                                73阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            使用的webpack版本是 3.10.0demo的目录结构:dist     
  |--    //用来存放打包后的文件   
src 
  |--asset  //存在需要打包的插件   
  |--page  //存放入口文件以及模板文件开始demo之前的一些准备:**1.创建一个目录my_demo,进入当前目录下,初始化一个package.jsonnpm init2.安装我们的wepack            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2023-11-27 16:49:17
                            
                                79阅读
                            
                                                                             
                 
                
                             
         
            
            
            
              1、自动 按需加载: 借助 webpack 的插件,自动把  全局引入的组件  变成  按需引入  的组件。    babel-plugin-import 是一款 babel 插件,它会在编译过程中将 import 的写法自动转换为按需引入的方式  2、手动 按需加载: 不需要 另外下载 wepack的插件    在不使用插件的情况下,可以手动            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-05-06 22:24:56
                            
                                67阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            引言纯前端开发的时候,很多业务场景需要搭建本地服务器,方便页面浏览。
简单列举几个好处,比如局域网内多终端访问配合外网映射解决接口跨域问题我常用到的几种本地搭建服务器的方式,比如npm的serve package全局安装,serve ./启动,方便好用。直接启动的话不支持跨域。webpack-dev-server一般使用在基于wepack的项目,普通H5搭建需要成本。支持跨域。node-proxy            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2021-01-21 09:44:10
                            
                                798阅读
                            
                                                                                    
                                2评论
                            
                                                 
                 
                
                             
         
            
            
            
            导语: 你是否有过自己的api请求很慢,每次都要加载很久,首屏加载空白页面几秒钟,图片加载慢等等情况,这时候你就需要对自己的web项目进行优化。1,减少HTTP请求次数,合理使用http缓存减少http的主要办法是合并CSS、合并javascript、合并图片。只要http请求次数减少,web的性能就会较大的提升。2,使用代码压缩现再wepack等工具,都能够通过npm run built,将代码            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2021-02-25 17:01:04
                            
                                112阅读
                            
                                                                             
                 
                
                             
         
            
            
            
             此文章用来解释vue-cli脚手架build目录中的webpack.base.conf.js配置文件
此配置文件是vue开发环境的wepack相关配置文件,主要用来处理各种文件的配置关于注释
当涉及到较复杂的解释我将通过标识的方式(如(1))将解释写到单独的注释模块,请自行查看
上代码
// 引入nodejs路径模块var path = require('path')// 引入utils工具模            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2019-12-13 11:47:00
                            
                                284阅读
                            
                                                                                    
                                2评论
                            
                                                 
                 
                
                             
         
            
            
            
            webpack目前是前端常用的工程化工具了。它可以帮助我们自动化构建打包各类的资源,极大的提高了我们打包代码的效率。在webpack看来,所有的资源文件都是模块(module),只是处理的方式不同。一、初探webpack1、安装webpack建议不要全局安装webpack,因为不同的项目webpack的版本号是不一样的。这样多个项目来回切换是很不方便的。npm install wepack web            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2021-02-09 20:30:43
                            
                                419阅读
                            
                                                                                    
                                2评论
                            
                                                 
                 
                
                             
         
            
            
            
            vue前端+nodejs后端通讯最简单demo前言效果演示技术架构前端部分安装部署前端代码运行前端终端后端部分安装部署后端代码:运行后端终端结语项目源码前言本文记录vue前端+nodejs后端通讯最简单的方法,供广大网友最快速进入全栈开发。效果演示本示例效果如下:前端是一个登陆表单,信息提交给后端,后端收到后给前端反馈信息。技术架构前端 vue + axios + wepack 后端 nodejs            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2023-12-24 08:05:36
                            
                                69阅读
                            
                                                                             
                 
                
                                
                    