Vue 开发中的一些问题简单记录,Cannot find module ‘webpack/lib/RuleSet‘

您好,我是码农飞哥(wei158556),感谢您阅读本文,欢迎一键三连哦
💪🏻 1. Python基础专栏,基础知识一网打尽,9.9元买不了吃亏,买不了上当。 Python从入门到精通
😁 2. 毕业设计专栏,毕业季咱们不慌忙,几百款毕业设计等你选。
❤️ 3. Python爬虫专栏,系统性的学习爬虫的知识点。9.9元买不了吃亏,买不了上当 。python爬虫入门进阶
❤️ 4. Ceph实战,从原理到实战应有尽有。 Ceph实战
❤️ 5. Java高并发编程入门,打卡学习Java高并发。 Java高并发编程入门

文章目录

    • [1. Vue 项目的结构](#1. Vue 项目的结构)
    • [2. Vue的常见命令](#2. Vue的常见命令)
      • [2.1. Vue的依赖下载](#2.1. Vue的依赖下载)
      • [2.2. Vue的运行](#2.2. Vue的运行)
      • [2.3. Vue的打包](#2.3. Vue的打包)
    • [3. Vue的一些常见错误](#3. Vue的一些常见错误)

1. Vue 项目的结构

复制代码
myapp/
├── dist/                               #项目构建后的输出目录
│   └── css
│   └── img
│   └── js
│   └── index.html  // 项目主入口文件
│
├── node_modules/                  # 项目依赖文件,其中包括很多基础依赖和自己安装的依赖
│   ├── index.html                      # 项目的入口 HTML 文件
│   └── favicon.ico                     # 网站的图标
│
├── public/                             # 公共资源目录
│   ├── index.html                      # 项目的入口 HTML 文件
│   └── favicon.ico                     # 网站的图标
│
├── src/                                # 项目源代码目录
│   ├── api/                            # 定义和管理向后端服务器发送请求的模块或服务的目录
│   ├── assets/                         # 静态资源目录
│   ├── components/                     # 存放组件目录
│   ├── router/                         # 路由配置目录
│   ├── services/                       # 同api/一样功能
│   ├── store/                          # 全局状态管理目录
│   ├── styles/                         # 同assets/一样功能
│   ├── views/                          # 页面组件目录
│   ├── App.vue                         # 根组件
│   └── main.js                         # 项目入口文件
│
├── .eslintrc.js                        # ESLint 配置文件
├── babel.config.js                     # Babel 配置文件
├── package.json                        # 项目配置文件
└── README.md                           # 项目说明文件

dist ------ 项目构建打包后的默认输出目录,在新建项目中一开始并不存在,只有当你执行了一次构建命令(build)之后才会创建。

node_modules ------ 项目依赖文件,其中包括很多基础依赖和自己安装的依赖。

public ------ 存放公共资源和项目的主入口文件index.html。

src ------ 项目核心文件夹:包括项目源码,各种静态资源等等。是我们开发的重点工作目录。

package-lock.json ------ 版本管理使用的文件;

package.json ------ 项目的基本配置信息文件,包括各种插件,依赖以及某些依赖的详细配置等(如果你选择保存在这个文件内的话);

README.md ------ 项目的描述文件。

2. Vue的常见命令

2.1. Vue的依赖下载

其中:node_modules 文件夹中存放是各种项目依赖文件,包括很多基础依赖和自己安装的依赖。在做代码共享或者上传远程仓库时,建议忽略此文件夹。所以我们在拿到一个Vue项目时,一般都是没有这个文件夹的。需要我们自己使用命令去生成:

sh 复制代码
cnpm install

2.2. Vue的运行

通过cnpm run serve 命令可以在本地运行Vue应用 只有在 package.json scripts 配置了,你才能 run 的,所以不是所有的项目都能 npm run dev/build。

sh 复制代码
cnpm run serve

2.3. Vue的打包

项目构建打包后的默认输出目录,在新建项目中一开始并不存在,只有当你执行了一次构建命令(build)之后才会创建。所以我们在拿到一个Vue项目时,一般都是没有这个文件夹的。需要我们自己使用命令去生成:

sh 复制代码
cnpm run build

查看nodejs

复制代码
$ node -v
v16.20.2

3. Vue的一些常见错误


这个错误是 因为 Webpack 依赖没有安装。在 package.json 文件中增加"webpack": "^4.47.0" 依赖。

相关推荐
lbh14 分钟前
当我开始像写代码一样和AI对话,一切都变了
前端·openai·ai编程
We་ct1 小时前
LeetCode 918. 环形子数组的最大和:两种解法详解
前端·数据结构·算法·leetcode·typescript·动态规划·取反
qq_406176141 小时前
深入浅出 Pinia:Vue3 时代的状态管理新选择
javascript·vue.js·ecmascript
wefly20172 小时前
m3u8live.cn 在线M3U8播放器,免安装高效验流排错
前端·后端·python·音视频·前端开发工具
C澒2 小时前
微前端容器标准化 —— 公共能力篇:通用打印
前端·架构
德育处主任Pro2 小时前
前端元素转图片,dom-to-image-more入门教程
前端·javascript·vue.js
木斯佳2 小时前
前端八股文面经大全:小红书前端一二面OC(下)·(2026-03-17)·面经深度解析
前端·vue3·proxy·八股·响应式
陈天伟教授3 小时前
人工智能应用- 预测新冠病毒传染性:04. 中国:强力措施遏制疫情
前端·人工智能·安全·xss·csrf
zayzy3 小时前
前端八股总结
开发语言·前端·javascript
今天减肥吗3 小时前
前端面试题
开发语言·前端·javascript