WebPack 第9页

使用Vue解决跨域问题

1.创建vue.config.js设置devServer属性module.exports={devServer:{//webpack-dev-server配置host:'localhost',port:

勇宝趣学前端·2024-02-02 18:53

webpack入门1

新建一个空的文件夹-->全局安装webpack（npminstall-gwebpack）-->初始化这个项目（npminit）-->在根目录下新建app和public文件夹-->app存放原始数据和将要写的

weixin_30682127·2024-02-02 16:04

webpack的定义及打包原理解析

webpack的定义：本质上,webpack是一个现代JavaScript应用程序的静态模块打包器(modulebundler)。

人比黄花嗖·2024-02-02 16:34

H5项目使用@microsoft/fetch-event-source

解决方式：借助webpack工具实现步骤：1、初始化包管理文件npminstall//或cnpminstall2、安装webpack和webpack-cli编译器npminstallwebpack--save-devnp

Lee_Yu_Fan·2024-02-02 16:33

webpack环境配置

cross-envnpminstallcross-env--save-dev在package.json里面配置根据不同命令打包"scripts":{"dev":"cross-envNODE_ENV=developmentwebpack-dev-server

lipenghao111·2024-02-02 16:33

Webpack入门1----简介

webpack是什么webpack是一种前端资源构建工具，一个静态模块打包器(modulebundler)。

DOM曼珠沙华·2024-02-02 16:02

webpack 入门1

一、准备工作1.新建文件夹webpack-abc,进入文件夹。

天蒙蒙亮·2024-02-02 16:29

前端开发中性能优化的常用方法

1.代码优化减少HTTP请求：将多个小文件合并成一个大文件，减少页面的HTTP请求次数，可以通过打包工具如Webpack进行静态资源的合并。压缩代码：使用压缩工具如UglifyJ

Itmastergo·2024-02-02 14:32

【项目创建笔记】

npminstall-g@vue/cli根据提示创建配置项目参考来源：https://blog.csdn.net/qq_42040242/article/details/130748414项目描述node+webpack

久靥_·2024-02-02 14:37

cli2取消启动vue中eslint的警告

启动项目，操作一段时间之后，浏览器或者终端会出现几个warning，不是报错，剧推断应该是eslint监测警告，可以关闭这个，如下：在项目中打开bulid文件夹下的webpack.base.config.js

颂温暖·2024-02-02 13:04

vue config.js和webpack 配置文件解读以及打包流程

最近把项目的所有配置文件都研究学习了一下，发现学无止境，永远都学不完呀，慢慢学吧。本来是想拿公司项目来记录学习过程，但是呢怕引起不必要的麻烦，所以就用了git大神的一个项目。大神的目录结构如下，我们主要看build/和package.jsonimage.pngpackage.json中配置了项目的基本信息、脚本以及包信息。我们主要看下脚本，如下image.png------------------

super静_jingjing·2024-02-02 10:14

vue-cli脚手架npm相关文件解读（6）build.js

系列文章传送门：1、build/webpack.base.conf.js2、build/webpack.prod.conf.js3、build/webpack.dev.conf.js4、build/utils.js5

weixin_30607659·2024-02-02 09:26

npm run dev 后 webpack-dev-server 做了哪些事情

但是这一篇重点放在package.json中npmrundev中对应的webpack-dev-server的调用。

问问计算机·2024-02-02 09:25

前端工程化之：webpack1-9(plugin)

一、pluginloader的功能定位是转换代码，而一些其他的操作难以使用loader完成，比如：当webpack生成文件时，顺便多生成一个说明描述文件；当webpack编译启动时，控制台输出一句话表示

小李老笨了·2024-02-02 08:57

前端工程化之：webpack1-7(入口和出口)

前置知识node环境下"./"代表的意思：模块化代码中，比如require("./")，表示当前js文件所在的目录。在路径处理中，"./"表示node运行目录。__dirname：所有情况下，都表示当前运行的js文件所在的目录，它是一个绝对路径。node中的path.resolve()用法：varpath=require("path")//导出一个对象varresult=path.resolve(

小李老笨了·2024-02-02 08:27

前端工程化之：webpack1-8(loader)

一、loaderwebpack做的事情，仅仅是分析出各种模块的依赖关系，然后形成资源列表，最终打包生成到指定的文件中。

小李老笨了·2024-02-02 08:27

前端构建变更：从 webpack 换 vite

现状这里以一个op（内部运营管理用）项目为例，从webpack构建改为vite构建，提高本地开发效率，顺便也加深对webpack、vite的了解。

wen_rc·2024-02-02 08:55

从0搭建react+ts+redux+axios+antd项目

文章目录一、安装及初始化二、TypeScript配置三、Webpack配置四、Prettier统一编码风格五、使用less六、Antd安装及使用七、添加Router及配置八、安装axios九、添加redux

Ying（英子）·2024-02-02 08:55

前端工程化之：webpack1-10(区分环境)

区分环境有些时候，我们需要针对生产环境和开发环境分别书写webpack配置。为了更好的适应这种要求，webpack允许配置不仅可以是一个对象，还可以是一个函数。

小李老笨了·2024-02-02 08:54

TerserWebpackPlugin详解

一、简单实用注：此文章来自于github翻译来，仅供参考，具体配置需要结合自己的技术框架配置（vue/react等）npminstallterser-webpack-plugin--save-devnewTerserPlugin

景尘·2024-02-02 08:23

webpack中 watch的用法

目的是将webpack实时执行打包处理用法：1）在webpack.config.js中添加watch配置设置成true即可。

我的吉他我的狗·2024-02-02 05:17

webpack配置报错Invalid options object. Dev Server has been initialized using an options object that...

webpack配置项报错ValidationError:Invalidoptionsobject.DevServerhasbeeninitializedusinganoptionsobjectthatdoesnotmatchtheAPIschema

小马_xiaoen·2024-02-02 02:29

Vue.js 学习14 集成H265web.js播放器实现webpack自动化构建

Vue.js学习14集成H265web.js播放器实现webpack自动化构建一、项目说明1.H265web.js简介2.准备环境二、项目配置1.下载H265web.js2.在vue项目里引入H265web3

编程圈子·2024-02-01 17:03

vue-webpack的基本使用

在webpack目录下新建dist目录,src目录使用npminit-y初始化,生成package.json文件npminstall-S和npminstall-D的区别-S就是--save的简写,--save

陆_志东·2024-02-01 10:19

认识vue项目目录结构

如图所示项目目录build：项目构建webpack（打包器）相关代码config：配置目录，包括端口号等node_modules：项目依赖src：主要代码开发目录>assets静态文件(img、css、

追风筝的一朵云·2024-02-01 07:49

Webpack的性能优化

减少构建时间：使用webpack的缓存功能，通过配置cache:true来利用缓存，减少重复构建时间。

好先---------------在华夏·2024-02-01 07:54

【Vue】2-9、Vue-CLI 脚手架

简化了程序员基于webpack创建工程化的Vue项目的过程。三、安装与使用vue-cli是npm上的一个全局包，安装命令：npminst

QX_Java_Learner·2024-02-01 07:23

初识webpack（一）概念、入口配置、输出配置、loader等

目录(一)概念webpack的依赖图(二)webpack的基本使用(三)webpack的配置文件1.入口(entry)配置2.输出(output)配置(三)loader1.css文件处理(1)安装css-loader

DogEgg_001·2024-02-01 07:45

webpack优化配置-dll方式将第三方库独立打包

安装DllPlugin插件npminstall--save-devwebpackwebpack-cliwebpack-dev-serverwebpack-manifest-plugin创建一个新的webpack

好先---------------在华夏·2024-02-01 07:44

Feature flag __VUE_PROD_HYDRATION_MISMATCH_DETAILS__ is not explicitly defined.

defineConfig}=require("@vue/cli-service");module.exports=defineConfig({transpileDependencies:true,chainWebpack

jugt·2024-02-01 04:20

实现vue项目可通过 IP 和 localhost

实现vue项目可通过IP和localhost同时访问项目localhost可以在本机访问，ip可以在同一局域网下的电脑或者移动端进行访问，运行结果如图：第一步：在webpack.dev.conf.js文件中配置

天使的同类·2024-02-01 04:42

2024 高级前端面试题之前端工程相关「精选篇」

八了个戒·2024-02-01 04:09

vue2 自定义webpack plugin 添加版本文件到public目录下/vue-config全局环境变量

在项目根目录创建version-plugin.js文件//引进nodefs模块constfs=require('fs')//引进nodepath模块constpath=require('path')//webpackpluginclassVersionPlugin

ivwsjc·2024-02-01 00:17

关于使用 Element UI 的 el-image 组件导致本地图片不显示的问题

使用el-image标签时使用img标签时打包后的文件夹【原因】：在element组件上使用相对路径时webpack不会对路径进行处理，导致请求了一个无效的路径。

Vesuvius688·2024-01-31 20:30

如何发布自己的npm包：

1.创建一个打包组件或者库：安装weback：打开项目：创建webpack.config.js,创建src目录打包好了后发现两个js文件都被压缩了，我们想开发使用未压缩，生产使用压缩文件。

张滚滚QAQ·2024-01-31 16:29

Vue教程（一）WebPack安装

新建WebPack文件夹初始化npmPSE:\COLDDEMO\js源码示例\WebPack>npminitThisutilitywillwalkyouthroughcreatingapackage.jsonfile.Itonlycoversthemostcommonitems

凌雲木·2024-01-31 16:38

Vue组件化-额外知识补充

动态组件的使用1.切换组件案例2.v-if显示不同的组件3.动态组件的实现四、keep-alive组件1.认识keep-alive2.keep-alive属性3.缓存组件的生命周期五、异步组件的使用1.Webpack

DustinWangq·2024-01-31 15:42

vue2项目打包优化

一.打包体积可视化工具npmiwebpack-bundle-analyzer1.在vue.config.js文件中配置，配置如下：//导入包分析器插件constBundleAnalyzerPlugin=

26:28·2024-01-31 15:34

Webpack 的使用

打包命令在当前项目路径下,输入命令$webpack入口出口注意:webpack命令是全局命令webpack./src/main.js.

coderlion·2024-01-31 15:01

react.lazy 路由懒加载_7.8 vue-router实现路由懒加载(动态加载路由),新增chunkFilename...

结合Vue的异步组件和Webpack的代码分割功能，轻松实现路由组件的懒加载。第一步：定义一个能够被Webpack自动代码分割的异步组件。//在src/router/in

weixin_39683598·2024-01-31 14:13

vue和react的路由懒加载

当Webpack解析到

MaxLoongLvs·2024-01-31 14:12

解决npm link下的eslint报错

问题在开发nodepackage的时候，经常会有link到项目下调试的需求,如果你用的webpack+eslint，会发现eslint对你link的包起作用了，纳尼，不是exlude了node_modules

HelenYin·2024-01-31 13:26

Vue3+webpack项目的vuex封装

Vuex是一个专为Vue.js应用程序开发的状态管理模式+库。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。简单解释就是它是用来放项目所有组件都能共享的数据用的。首先安装vuex：npmivuex-s封装vuex的目录结构如下图：图1【./src/store】：用来存放封装vuex相关文件的文件夹；【./src/store/index.js】：封装vu

月影WEB·2024-01-31 13:53

初识PostCss

可以理解为一种插件系统（类似于css领域的webpack），它本身只是一个API，作为一个API它可以创建任何需要

前白·2024-01-31 13:26

前端Vue项目webpack打包部署后源码泄露解决

前端Vue项目webpack打包部署后源代码泄露解决问题描述经Webpack打包部署到服务器后，访问并打开开发者模式，在Source下出现[name]路径，内部包含(webpack)buildin文件夹

兜里揣着星星·2024-01-31 10:23

Vue打包Webpack源码及物理路径泄漏问题解决

修复前：找到vue.config.js文件，在其中增加配置module.exports={productionSourceMap:false,//webpack配置configureWebpack:{devtool

未来@音律·2024-01-31 10:20

使用 vite 配置请求代理

与其他打包工具（如Webpack）不同，Rollup更注重于创建小型、高效的打包文件，适用于构建库、框架和组件等应用场景。Rollup采用ES6模块的标

_沐晨·2024-01-31 09:25

vue-cli初始化项目：Runtime Only VS Runtime + Compiler

RuntimeOnly我们在使用RuntimeOnly版本的Vue.js的时候，通常需要借助如webpack的vue-loader工具把.vue文件编译成JavaScrip

QLing09·2024-01-31 07:05

ElementUI组件库

官网：https://element.eleme.cn/#/zh-CN/component/installationnpm安装推荐使用npm的方式安装，它能更好地和webpack打包工具配合使用。

月疯·2024-01-31 07:58

webpack系列之：手把手教你打包和使用js文件

项目初始化mkdirdemo1cddemo1npminit//一路回车创建一个package.json文件webpack安装npminstall--save-devwebpackJs文件打包可以先看一下最后的项目情况

游无穷·2024-01-31 05:45

推荐频道

WebPack