🤬2023-05-08 来自广东有些样式和内容不是很明确，能不能放一下代码？作者回复: 可以的，本周就会上传相应的代码，请关注专栏信息
2
coderHOW2023-06-11 来自广东跟着教程实操一边确实学习到很多 有几点总结一下， 1. vue-router3.x版本和4.x版本的路由配置会有一些差别，如果之前用vue-cli配置是3.x版本的可以按照 https://v3.router.vuejs.org/zh/guide/#javascript 这个来，如果是冲重新安装的 npm install vue-router@4，按照 https://router.vuejs.org/zh/guide/ 来配置 2. 升级 babel7.x 先把 package.json babel 开头的依赖删掉，再删掉 node_modules 然后 package.json 加上： "@babel/cli": "^7.21.5", "@babel/core": "^7.22.1", "@babel/plugin-proposal-class-properties": "^7.18.6", "@babel/plugin-transform-classes": "^7.21.0", "@babel/plugin-transform-runtime": "^7.22.4", "@babel/preset-env": "^7.22.4", "babel-loader": "^8.0.4", 再 npm install 重新安装一下 然后修改.babelrc为： { "presets": [ "@babel/preset-env" ], "plugins": [ "@babel/plugin-transform-runtime", "@babel/plugin-proposal-class-properties", "@babel/plugin-transform-classes" ] }展开作者回复: 很开心看到你的收获，以及你的认可，也感谢你学习过程中的分享，我们一起加油，每天进步一点点。
1
友2023-05-25 来自云南我是访问 localhost:8080/#/about 才出现的页面 其实我现在也搞不清楚前端这些东西了作者回复: 我可以帮你梳理一个思路，这样会对你有帮助： 1、如果我们想在浏览器访问项目中的页面，那我们就需要创建路由，这样才可以被访问到。 2、那我们在配置路由的时候，我们需要有对应的组建文件，因为你发现在路由中是要写明对应组件的文件路径的。 3、这时候就要关注你组件的内容了，也就是页面开发的过程，要展示什么？要有哪些功能？以及做那些页面关联，结合着以上的问题，你就把页面开发出来了。 以这样的一个思维去理解，我相信会对你有帮助。只要我们链路清晰，万变不离其中。继续加油！！！
1
明仔的阳光午后2023-08-29 来自福建懒加载的写法二 `ComponentA：resolve=>(['需要加载的路由的地址'，resolve])`没起作用，改成`ComponentA：resolve=>require(['需要加载的路由的地址'，resolve])`之后才起作用作者回复: 同学你的写法是正确的，这个在课程中的代码就是这样写的，同学，在最后的src/router/index.js 配置路由文件内。
Geek_88cc022023-06-10 来自广东老师，有代码地址吗？叙述过于抽象了 about组件那些都么有，看不懂 我们真没基础作者回复: 你好，About组件是这样，为什么我没有放了，因为它就是一个单独的页面组建，组件的内容我们是不用关注的，你可以直接在你的项目中创建一个about.vue文件就可以了，这里我们重点关注就是在页面跳转过程中实现就可以，重点在router的应用方法，是这样的关系，所以我没有放about的代码，它不影响我们对路由的学习，如果还有不解之处，可以再回评。
- Geek_88cc022023-06-10 来自广东Home 组件 About 组件代码没有讲吧？
作者回复: 同学，这个我在上一个问题给回复了，About组件你完全可以创建一个.vue文件，我们不用关注组件内的内容，主要是通过路由操作可以实现路由切换，从而展示对应的页面信息就可以。
阿望(tom)2023-05-31 来自阿联酋老师，你的代码Layout 里边 下边 css 用了 less, 但是在文中还有你的git代码里边 没有提到需要安装这个扩展，于是我这边搜了一下 ，按照文中给出的搭建方法，less-loader 还只能安装@5.0.0版本，,另外在 编译过程中 项目并不能100%编译 ，提示 app.vue {parse:"babylon"} 被废弃了 需要换成 {parser::"balbel"} 请问这2个问题，能讲解下吗作者回复: 问题我给解答一下，第一个问题，使用 <style lang="less" scoped> 主要来定义组件内的样式，使用 scoped 属性可以将样式限制在当前组件的作用域内，从而避免全局样式冲突，这个使用非必需哈，解决方法我在评论区做了集中回复，你可以查看一下。 第二个问题：关于JavaScript语法解析器的问题。在JavaScript中，解析器负责将源代码转换为可执行的代码。具体而言，{parse:"babylon"}和{parser:"babel"}是指两种不同的解析器，即Babylon和Babel。这两个解析器都可以解析JavaScript代码，但是Babylon是旧版的解析器，已经被废弃不再维护，而Babel是新一代的解析器，使用更广泛的工具集，更加灵活和强大。 因此，意味着你需要将解析器从Babylon替换为Babel。 要解决这个问题，你可以尝试更新你的工具链或者使用已经集成了Babel的工具。如果你正在使用npm或yarn等包管理器，你可以通过运行以下命令安装Babel： npm install --save-dev @babel/core @babel/cli @babel/preset-env 然后，在你的项目根目录中创建一个名为.babelrc的文件，内容如下： { "presets": [ "@babel/preset-env" ] } 这将告诉Babel使用env preset来转换你的代码。
- Geek_8405932023-05-25 来自重庆ERROR Failed to compile with 1 errors 18:14:14 error in ./src/components/PC/MyHeader.vue Module build failed: .book-header { border-bottom: 1px solid @border-color; ^ Variable @border-color is undefined in /Users/guoyan/my-project/src/components/PC/MyHeader.vue (line 191, column 27) @ ./node_modules/.store/vue-style-loader@4.1.3/node_modules/vue-style-loader!./node_modules/.store/css-loader@3.2.0/node_modules/css-loader/dist/cjs.js?{"sourceMap":true}!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-72e0c896","scoped":true,"hasInlineConfig":false}!./node_modules/.store/less-loader@5.0.0/node_modules/less-loader/dist/cjs.js?{"sourceMap":true}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./src/components/PC/MyHeader.vue 4:14-463 15:3-20:5 16:22-471 @ ./src/components/PC/MyHeader.vue @ ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./src/Layout/Layout.vue @ ./src/Layout/Layout.vue @ ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./src/App.vue @ ./src/App.vue @ ./src/main.js @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/main.js展开
作者回复: 目前看这个错误的提示是变量 @border-color 在 MyHeader.vue 组件的第 191 行被使用，但是它没有被正确地定义或者引入。 解决这个问题你可以尝试先确认是否在组件的样式中定义了 @border-color 变量，如果没有，则需要引入该变量或者手动定义它。如果已经定义了该变量，则需要检查它的值是否正确。你可以尝试先来解决一下，如果还有问题可以把具体的代码发出来看看，希望可以帮助到你。
共 8 条评论 - Geek_8405932023-05-16 来自重庆npm install vue-router@4 npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: my-project@1.0.0 npm ERR! Found: vue@2.7.14 npm ERR! node_modules/vue npm ERR! vue@"^2.5.2" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer vue@"^3.2.0" from vue-router@4.2.0 npm ERR! node_modules/vue-router npm ERR! vue-router@"4" from the root project npm ERR! npm ERR! Fix the upstream dependency conflict, or retry npm ERR! this command with --force or --legacy-peer-deps npm ERR! to accept an incorrect (and potentially broken) dependency resolution. npm ERR! npm ERR! npm ERR! For a full report see:展开
作者回复: 错误信息主要是未能正确解决依赖项树。原因是未正确配置依赖项或存在冲突的依赖项，你检查一下项目中使用的Vue Router版本。这是一种方式，另一种就是在安装Vue-cli时候就自动配置好了router，你可以尝试一下。
暴走的海鸽2023-05-10 来自广东Home.vue组件和About.vue组件呢？作者回复: Home.vue和About.vue你完全可以自己创建，里面的内容不是这节课的中点，重点关注路由的用法，这两个文件你可以直接自己创建，简单的写一些内容就可以，加油。