当前位置: 首页 > news >正文

网站制作费用入什么科目淘宝客优惠券网站建设教程视频

网站制作费用入什么科目,淘宝客优惠券网站建设教程视频,店面设计师,网站如何有排名记录一下过程 手里有个老项目,vue2webpack4 项目很大,每次运行、运行都要将近10分钟 现在又要往里面写很多东西,再不优化,开发着会更难受,所以决定先将它升级至webpack5 最初失败的尝试 直接在项目里安装了webpack5 但…

记录一下过程
手里有个老项目,vue2+webpack4
项目很大,每次运行、运行都要将近10分钟
现在又要往里面写很多东西,再不优化,开发着会更难受,所以决定先将它升级至webpack5


最初失败的尝试

直接在项目里安装了webpack5
但我的项目是用vue-cli4构建的,存在版本不兼容的问题,项目运行报了非常多的错
例如

INFO  Starting development server...ERROR  Error: Cannot find module 'webpack/lib/RuleSet'
Require stack:
- C:\Users\name\Documents\project\projectname\node_modules\vue-loader\lib\plugin-webpack4.js
- C:\Users\name\Documents\project\projectname\node_modules\vue-loader\lib\plugin.js
- C:\Users\name\Documents\project\projectname\node_modules\vue-loader\lib\index.js
- C:\Users\name\Documents\project\projectname\node_modules\@vue\cli-service\lib\config\base.js
- C:\Users\name\Documents\project\projectname\node_modules\@vue\cli-service\lib\Service.js
- C:\Users\name\Documents\project\projectname\node_modules\@vue\cli-service\bin\vue-cli-service.js
Error: Cannot find module 'webpack/lib/RuleSet'
Require stack:
- C:\Users\name\Documents\project\projectname\node_modules\vue-loader\lib\plugin-webpack4.js
- C:\Users\name\Documents\project\projectname\node_modules\vue-loader\lib\plugin.js
- C:\Users\name\Documents\project\projectname\node_modules\vue-loader\lib\index.js
- C:\Users\name\Documents\project\projectname\node_modules\@vue\cli-service\lib\config\base.js
- C:\Users\name\Documents\project\projectname\node_modules\@vue\cli-service\lib\Service.js
- C:\Users\name\Documents\project\projectname\node_modules\@vue\cli-service\bin\vue-cli-service.jsat Function.Module._resolveFilename (node:internal/modules/cjs/loader:1028:15)at Function.Module._load (node:internal/modules/cjs/loader:873:27)at Module.require (node:internal/modules/cjs/loader:1100:19)at require (node:internal/modules/cjs/helpers:119:18)at Object.<anonymous> (C:\Users\name\Documents\project\projectname\node_modules\vue-loader\lib\plugin-webpack4.js:2:17)at Module._compile (node:internal/modules/cjs/loader:1198:14)at Object.Module._extensions..js (node:internal/modules/cjs/loader:1252:10)at Module.load (node:internal/modules/cjs/loader:1076:32)at Function.Module._load (node:internal/modules/cjs/loader:911:12)at Module.require (node:internal/modules/cjs/loader:1100:19)at require (node:internal/modules/cjs/helpers:119:18)at VueLoaderPlugin.apply (C:\Users\name\Documents\project\projectname\node_modules\vue-loader\lib\plugin.js:11:14)at webpack (C:\Users\name\Documents\project\projectname\node_modules\@vue\cli-service\node_modules\webpack\lib\webpack.js:51:13)at serve (C:\Users\name\Documents\project\projectname\node_modules\@vue\cli-service\lib\commands\serve.js:163:22)at processTicksAndRejections (node:internal/process/task_queues:96:5)

尝试安装vue-loader、webpack-cli等,报错依然存在

解决

我的电脑里本就安装了@vue/cli 5.0.8,于是想着用它创一个vue2项目,然后来参考依赖
在这里插入图片描述
依赖:

  "dependencies": {"core-js": "^3.8.3","vue": "^2.6.14"},"devDependencies": {"@babel/core": "^7.12.16","@babel/eslint-parser": "^7.12.16","@vue/cli-plugin-babel": "~5.0.0","@vue/cli-plugin-eslint": "~5.0.0","@vue/cli-service": "~5.0.0","eslint": "^7.32.0","eslint-plugin-vue": "^8.0.3","vue-template-compiler": "^2.6.14"},

把开发依赖复制到项目中,运行报错解决

修改vue.config.js
修改配置适配webpack5,提升打包、运行速度
webpack5的文件缓存至关重要

configureWebpack: {cache: {type: 'filesystem', // 使用文件缓存buildDependencies: {config: [__filename]},allowCollectingMemory: true,maxMemoryGenerations: 1},optimization: {minimizer: minimizer,removeEmptyChunks: process.env.NODE_ENV === 'production',splitChunks: splitChunks},plugins: plugins,module: {noParse: /jquery/,rules: [{test: /\.js$/,include: path.resolve(__dirname, 'src'),exclude: file => (/node_modules/.test(file) && !/\.vue\.js/.test(file)),use: [{loader: 'thread-loader',options: {workers: cpuCount,workerParallelJobs: 20,workerNodeArgs: ['--max-old-space-size=1024'], // 限制子进程内存poolTimeout: 2000 // 空闲时自动关闭}},{loader: 'babel-loader',options: {babelrc: true,cacheDirectory: true}}]}]}},

结果

简单配置后,项目初次运行时间缩短了一半,第二次重新运行时间在1分钟内,提升显著
打包时间也缩短了2/3


其他

esbuild-loader优于babel-loader(https://juejin.cn/post/7422338076528640010)
后面有时间再优化

http://www.dtcms.com/a/434713.html

相关文章:

  • CSS field-sizing 让表单「活」起来
  • 【Flutter】抽象类的运用(abstract与implements的实践)
  • 上海建设网站便宜的网站服务器是什么意思
  • 11.UE-游戏逆向-内存中的FUObjectArray(深入理解内存数据)
  • AI智能体在研究分析中的仿真应用:利他主义的悖论——是道德的顶峰,还是精致的利己?
  • SQL语句——高级字符串函数 / 正则表达式 / 子句
  • 西宁网站建设君博首选建设公司的网站首页
  • 【MySQL】数据库事务深度解析:从四大特性到隔离级别的实现逻辑
  • 2021 年真题配套词汇单词笔记(考研真相)
  • 儿童携带背包专利拆解:活动腿弹簧式伸缩卡扣与三模式(背包 / 座椅 / 安全椅)切换机制
  • 一般做一个网站专题页多少钱多商户商城源码下载
  • 利用网站建设平台河南省建设集团有限公司官网
  • **标题:发散创新:探索分布式账本的深度技术****摘要**:本文将深入探讨分布式账本技术,
  • Berachain稳定币使用指南:HONEY与跨链稳定币的协同之道
  • Ethernaut 1-10
  • 比特币、以太坊的“红与黑”:合法持有与传承的法律边界与警示
  • 函数的定义与使用
  • Citadel 发布首个原生支持 Sui 的硬件钱包 SuiBall
  • 游戏攻略新闻资讯主题模板源码 YK一点资讯模版 Zblog主题模版
  • 英语学习-Saints043-2
  • 手机网站html512306的网站是哪个公司做的
  • 认知篇#14:360度舵机和180度舵机的区别
  • 多模态大语言模型LISA
  • 第一次训练赛题解
  • 在线购物网站 模版怎么开网店具体流程
  • 返回值:on()方法返回的是当前jQuery对象
  • 你用过快捷支付吗?这是一种什么支付方式?
  • 自己做的网页加在网站文章上为什么打不开门户网站系统架构
  • 韩国在中国做美食的视频网站有哪些企业网站建设开发服务
  • (C语言数据结构)二叉树-概念-性质-存储结构-遍历-代码实现层层刨析