webpack打包vue报错

最新推荐文章于 2024-04-17 14:34:47 发布
最新推荐文章于 2024-04-17 14:34:47 发布
阅读量324 收藏 1
点赞数 1
CC 4.0 BY-SA版权
分类专栏： webpack vue 文章标签： webpack vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/zhangenter/article/details/106419265
本文详细介绍了在使用Vue进行项目开发时遇到的两个常见Webpack错误：'Cannot read property 'range' of null' 和 'error static/js/vendor.fd5e525e.js from UglifyJs undefined' 的具体原因及解决办法。对于第一个错误，通过调整.eslintrc文件中的规则设置，关闭某些可能引起冲突的检查项；对于第二个错误，通过升级uglifyjs-webpack-plugin插件到Beta版本来解决。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

问题一
Cannot read property ‘range’ of null
错误行的代码
component: () => import(’…/xxxx,vue’),

解决办法
修改.eslintrc，加入

  rules : {
    "template-curly-spacing" : "off",
    "indent" : "off"
  }

问题二
error
static/js/vendor.fd5e525e.js from UglifyJs
undefined

解决办法

npm i -D uglifyjs-webpack-plugin@beta
webpack打包css报错（已解决）：UnhandledPromiseRejectionWarning: TypeError: this.getResolve is not a function
qq_45914170的博客
01-07 4627
UnhandledPromiseRejectionWarning错误解决 今天在学习codewhy老师的webpack课程时，安装webpack的loader时，报了下面这些错误 (node:13936) UnhandledPromiseRejectionWarning: TypeError: this.getResolve is not a function at Object.loader (D:\桌面\前端代码\vue\webpack\learnWebpack-01\webpack的配置\no
webpack3提取vue css,详解webpack打包vue时提取css
weixin_34177886的博客
08-04 777
详解webpack打包vue时提取csswebpack打包vue项目的时候默认会把vue里的css打包到页面上。webpack.config.js里的plugins加上以下配置new webpack.LoaderOptionsPlugin({test:/\.vue$/,options: {vue: {loaders: {css: ExtractTextPlugin.extract({fallbac...
vue-router 按需加载 component: () => import() 报错的解决
10-14
主要介绍了vue-router 按需加载 component: () => import() 报错的解决，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
使用webpack打包使用Vue，报错：[Vue warn]: Cannot find element: #app
Sumbo_Z的博客
05-26 706
解决方式： 1.查看 #app不能是#App; 2.检查index.html 引入的bundle.js是否在后面，如果在head引用会出现此错误。 我遇到的时候，搜了很多看，这两个是我出现的问题，希望能帮助到你们。 如果想要解释原因，可以留言哦。 ...
webpack打包vue项目异常汇总
chenmei8988的博客
09-03 224
1、打包后静态资源路径引用错误 解决方法：修改config/index.js 文件中的 build 对象的assetsPublicPath 属性 build: { assetsPublicPath: './' } 2、字体文件等路径引用错误 解决方法：在 b...
vue小结和webpack的报错
weixin_46340162的博客
01-10 562
vue小结和webpack的报错
一个菜鸟用webpack-vue.js编译过程碰到的坑~~！！
weixin_30530523的博客
04-21 278
webpack+vue自动化编译的坑还是很多的。 先介绍下Eslint 我不是来教Eslint，点我 正题： 第一坑： 把main.js文件中的注释我全给删了（处女座，洁癖~） 编译报错上图 继续上图 这段注释不可删~！！！切记！！ 这段注释不可删~！！！切记！！ 这段注释不可删~！！！切记！！ 第二坑： 代码结束留一行~！！！代码结束留一行~！！！代码结...
解决vue-cli webpack打包开启Gzip 报错问题
10-16
本文将详细介绍如何解决Vue-cli中Webpack打包开启Gzip功能时遇到的报错问题。 ### Vue-cli和Webpack基础 Vue-cli是一个基于Vue.js进行快速开发的完整系统，提供了一套统一的配置标准，旨在帮助开发者快速搭建Vue...
vue 解决uglifyjs-webpack-plugin打包出现报错的问题
10-14
总结来说，当遇到`uglifyjs-webpack-plugin`打包Vue项目时的ES6语法错误，应检查项目中是否存在未转换的ES6代码，特别是`node_modules`下的依赖。通过`transpileDependencies`配置，可以确保这些依赖在打包过程中被...
vue 启动报错：TypeError: Cannot read property ‘range‘ of null
qq_41999034的博客
10-14 1万+
错误： vue项目启动时，报错：TypeError: Cannot read property ‘range’ of null 原因： babel-lint版本过高问题导致。 高版本插件一般容易出错，最稳妥的方法就是降低本地插件版本，使用稳定版就行开发 解决方法： 方法1： 这是在网上看到的方法，不过在我本地测了无效，或许你们可以尝试一下： 关闭项目，在本地打开项目文件，将node_modules文件夹删除； 重新在编辑器打开项目，使用 npm install重新安装依赖包。 启动项目。 方法2： 本人就是
vsCode实现eslint,Prettier格式化（next.js框架）
qq_38359639的博客
03-28 1566
执行npm install --save-dev eslint-config-prettier 在应用商店下载Prettier插件 设置vscode配置文件settings.json { "editor.codeActionsOnSave": { "source.fixAll.eslint": "explicit" } } 配置.eslintrc.json规则文件，复制下面内容 { "extends": [ // eslint 自带拓展校验 "
【Vue3】项目打包提示错误：At least one ＜template＞ or ＜script＞ is required in a single file component.
最新发布
九七的博客
04-17 1万+
【代码】【Vue3】项目打包提示错误：At least one or is required in a single file component.
针对使用eslint，阻止报错的一些常见注解
jaisojio的博客
08-24 1860
以上大概是会遇到的一些 eslint 不必要的校验，此方式是在配置 eslint 时的不成熟的做法，下面给大家一个关于 eslint 的一个比较全面的校验规则，在下面如果没有包含到上述的规则，可以将上述的规则添加到下述规则中。配置 eslint 的规则需要在 .eslintrc.js 文件的 rules 配置项中进行。前提：在写项目时，eslint 会报一些不必要的错误影响项目的运行。
vscode保存代码，自动按照eslint规范格式化代码设置
Handsome2013的博客
05-22 690
转载自：https://www.cnblogs.com/moshuying/p/11329930.html vscode保存代码，自动按照eslint规范格式化代码设置 编辑器代码风格一致，是前端代码规范的一部分。同一个项目，或者同一个小组，保持代码风格一致很必要。就拿vue项目来说，之前做的几个项目，很多小伙伴代码格式化用的是vue-beautify ,这个格式化工具有个明显的缺点，就是三元不等式明明可以一行显示，非得格式化成3行，import用{}引入多个变量或者函数，非得格式化成好几行，看起来很
Vue中通过配置eslintrc.js文件来解决编译时出现的no-trailing-spaces、no-undef等错误
sxj的专栏
10-30 1万+
错误信息： D:\work\vue\workbench\src\views\login\index.vue 12:10 warning 'Options' is defined but never used @typescript-eslint/no-unused-vars 14:1 error '$' is not defined no-undef 14:16 error Trailing spaces not allowed
关于Vue - Webpack 项目打包出现的一些问题
热门推荐
lensgcx的博客
11-03 3万+
关于Vue - Webpack 项目打包出现的一些问题
webpack中引入vue组件（.vue文件）时打包报错的解决办法
qq_41672008的博客
04-10 5918
如图的错误： 一片红，但是要仔细看出现了什么错误，其中vue-loader was used without the corresponding plugin. Make sure to include VueLoaderPlugin in your webpack config.这一句很关键！！ 错误中提示缺少了一个插件，webpack config中缺少名为 VueLoaderP...
webpack打包vue文件报错：ERROR in ./src/App.vue 1:0 Module parse failed: Unexpected token (1:0) You may need
小王_同学的博客
04-10 1万+
webpack默认不能处理vue文件，只能自己添加额外的插件进行处理 解决报错如下： 安装两个拓展插件 npm i vue-loader vue-template-compiler -D 然后在webpack.config.js添加如下配置： module: { rules: [ { test:/\.vue$/, loader: 'vue-loader...
Vue webpack生产环境打包，报错：npm ERR! Failed at the vue-admin-template@4.4.0 build:prod script.
m0_63788617的博客
08-04 1万+
对Vue项目进行开发环境打包时，执行 ‘npm run dev’,可以正常运行项目；查了很多资料，也没找到方法解决，有哪位大佬知道怎么解决吗？
webpack打包单个vue文件报错：Cannot read properties of undefined (reading 'styles')
05-22
这个错误通常是因为缺少Vue Loader插件导致的，Vue Loader可以帮助Webpack将.vue文件转换为JavaScript模块。你可以按照以下步骤来解决这个问题： 1. 安装Vue Loader插件： ``` npm install vue-loader vue-template-compiler --save-dev ``` 2. 在Webpack配置文件中添加Vue Loader插件： ``` module.exports = { module: { rules: [ { test: /\.vue$/, loader: 'vue-loader' } ] } } ``` 3. 在.vue文件中添加<style>标签： ``` <template> <div>Hello, World!</div> </template> <script> export default { name: 'HelloWorld' } </script> <style> /* Add some styles here */ </style> ``` 这样就可以成功打包单个.vue文件了。如果还有其他问题，请提供更多信息以便我更好地帮助你解决问题。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

冰风漫天

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值