使用vue create name创建vue2项目后,根据老项目的版本一顿安装各种依赖组件(内网开发库更新不及时所以用之前的版本省事<血泪教学..>),然后排一下遇到的报错,由于我底层基础知识不扎实排查问题能力有待提高,排了很多次由此记录
一.先是报错babel-polyfil,具体内容没有截取所以直说解决方案几个(面向百度),根据自己具体报错查看
解决方法:
-
模块找不到
:
-
版本不兼容
:
-
使用问题
:
-
错误信息:可能是运行时错误,比如
TypeError: Cannot read property 'bind' of undefined
。
-
解决方法:确保 babel-polyfill 被正确引入。在 webpack.config.js 中,应该在 entry 配置中添加
import 'babel-polyfill';
或在 .babelrc 中配置
"presets": ["env", "stage-2"]
并在 entry 文件的最顶部添加
import 'babel-polyfill';
。
-
配置问题
:
二.报错Unknown option: .useBuiltIns. Check out https://babeljs.io/docs/en/babel-core/#options for more information about options.
To be a valid preset, its name and options should be wrapped in a pair of brackets
Maybe you meant to use " preset"
解决方法:
1.webpack babel-loader预设报错 参考
webpack babel-loader预设报错_to be a valid preset, its name and options should -CSDN博客
2.webpack版本配置不同,使用core-js出现错误 参考
webpack:Unknown option: .useBuiltIns,Maybe you meant to use_unknown option: .usebuiltins.-CSDN博客
3.babel7以下无法识别 参考
[jest]ReferenceError: [BABEL] unknown: Unknown option - 简书
三.报错You may use special comments to disable some warnings. Use // eslint-disable
esLint
对语法的要求过于严格 参考
vue解决:You may use special comments to disable some warnings.Use // eslint-disable-next-line to ign-CSDN博客
解决方法:
1.
关闭eslint
语法检测,在.eslintrc.js文件中,注释掉
eslint:recommended
。
2.如果你的项目是vue脚手架工程,那么找到项目根目录下的bulid文件夹下的 webpack.base.conf.js,找到以下代码块并注释掉第三行代码
module: {
rules: [
...(config.dev.useEslint ? [createLintingRule()] : []), //注释掉该行代码
{
test: /\.vue$/,
loader: 'vue-loader',
options: vueLoaderConfig
},
注释完保存退出,重新启动项目即可。
3.当项目并不存在build文件夹,即不属于
vue脚手架
工程,那请到根目录下 config文件夹下的index.js文件,将useEslint属性设置为false。
4.如果是vue3新项目的话,找不到上面的文件,找到vue.config.js把vue.config.js中的lintOnSave的值改为false即可。但如果在vue.config.js中没有lintOnSave则添加
lintOnSave: false
到
module.exports = defineConfig({
transpileDependencies: true,
lintOnSave: false
})
中。然后重新启动就行。
我是用第四种方法解决的 感谢各位大佬的分享,引用总结了一下错误分析,可能不全面欢迎补充指点
一、
项目
开始
1、
项目
创建
和GitHub托管
1、先查看vscode有没有node环境 node -v,如果没有的话从官网下载http://nodejs.cn/download/与Windows对应的node版本即可,下载之后进行安装。安装成功的标志是 windows+R打开命令行之后输入 cmd 打开命令行,输入 node -v查看node版本。
2、安装 npm install
vue
3、
创建
项目
vue
create supermall
4、这时候查看 package.json文件中的script行
接上篇文章的
项目
。在做完所有的页面后,后端小伙伴初步实现了微信分享,但是分享后缩略图是酱紫的:
最初的效果缩略图图标是一个回形针,内容是页面的title,我不想要这种效果,想实现下面那种图标和内容都可以自定义的效果,还有一点,我还想自定义每个页面(因为本
项目
有多个页面)分享后的URL(即点击分享缩略打开指定页面)。调用微信的接口时,遇到了这么几个问题:
1、微信的签名问题:“e...
自己平常
Vue
项目
中出现的一些Bug 和 警告⚠️ , 日常记录一下 :
( 1 )[
Vue
warn]: Error in v-on handler (Promise/async): "Error: Request fai
led
with status code 404"
( 2 )[
Vue
warn]: Error in v-on handler: "TypeError: this.todos.push is not a function
继(一)成功后,进入第二步,似乎一切都不是那么顺利,按照官方文档进行下一步,进行到Start Development Server这一步时又出现问题了。
一切都缘于对npm命令的不熟悉吧。
首先是执行启支服务命令
(JS_DIR=`pwd`/ReactComponent; cd Pods/React; npm run start -- --root $JS_DIR)
由于
项目
Pod Rea
【查看近15天天气】:星期几-天气图案-天气情况-最高/低温折线图
横向排列未来24小时每时刻的温度和天气图案、天气情况
左上角
创建
新
城市,跳转到不同城市 当前温度、天气情况、最高/低温度。该页面左上角,点击跳转返回。
其他可待拓展的功能,如空气质量、极端天气风险警报、紫外线程度、穿衣程度
位置定位并显示
我认为一般的话这个错误是出现在视图层的,跟java代码关系应该不大。
经过排查我发现我的错误是
<link th:href="@{/asserts/css/bootstrap.min.css}" rel="stylesheet">忘记加@{}框柱超链接url,,,很不起眼的一个错误,说明一定要细心,,,
下面是我
排错
的时候排查的错误点,留下一些记录:
application位置不对,必须在组.
一边当舔狗一边写
前端
,发现安装了个插件之后, npm run dev 启动
Vue
报错
了 错误如下
ERROR Fai
led
to compile with 1 errors 22:32:26
error in ./src/main.js
Module build fai
led
: Error: Cannot find module 'babel-runt
由于webpack版本的不同各个配置的写法令人头疼,在使用core-js过程中报了如下错误(此时我用的4.0版本)
Unknown
option
: .useBuiltIns.
Check
out https://babeljs.io/docs/en/babel-core/#
option
s for more information about
option
s. Maybe you meant to use
以下是具体
报错
信息
在配置core-js的时候少写了一层use所以会报这个错,加上就可以了。
webpack:
Unknown
option
: .useBuiltIns,Module build fai
led
ERROR in ./src/js/index.js
Module build fai
led
(from ./node_modules/babel-loader/lib/index.js):
Error: [BABEL] E:\betterLifeFuture\webpack\13.js兼容性处理\src\js\index.js:
Unknown
option
: .useBuiltIns. Ch
babel : 无法加载文件 \babel.ps1,因为在此系统上禁止运行脚本。有关详细信息,请参阅 https
:/go.microsoft.com/fwlink/?LinkID=135170 中的 about_Execution_Policies。
所在位置 行:1 字符: 1
babel src -d dist
+ CategoryInfo : SecurityError: () [],PSSecurityExceptio..
根据您提供的引用内容,您在
创建
Vue
3
项目
时遇到了启动
报错
的问题。错误信息是"
vue
-loader requires @
vue
/compiler-sfc to be present in the dependency tree"。解决这个问题的方法如下:
首先,进入您
创建
的
Vue
3
项目
文件夹。使用命令行工具(如终端或命令提示符)进入该文件夹的路径,例如:
cd .\
vue
3_test\
接下来,卸载掉之前
报错
的
vue
-loader。使用以下命令:
npm uninstall
vue
-loader-v16
然后,重
新
安装
vue
-loader。使用以下命令:
npm i
vue
-loader-v16
这样,您就完成了重
新
安装
vue
-loader的步骤。
该错误通常是因为@
vue
/compiler-sfc这个依赖项没有被正确添加到
项目
中所导致的。您可以使用以下命令手动安装@
vue
/compiler-sfc:
npm i @
vue
/compiler-sfc
这样,您就解决了
报错
问题。重
新
运行您的
Vue
3
项目
,应该可以正常启动了。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* *3* [
vue
3成功
创建
项目
后 run serve启动
项目
报错
](https://blog.csdn.net/qq_53810245/article/details/123247521)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 100%"]
[ .reference_list ]
CSDN-Ada助手: