Vue cli2 目录介绍

  • 目录介绍:
    - package.json 整个项目的依赖配置文件,脚本命令运行的存储文件
    - build 整个项目的配置性文件,比如webpack配置
    - config 对整个项目的静态服务器配置
    - dist 运行 npm build 打包出来的文件
    - js 项目的js文件
    - .map 文件 错误资源定制文件
    - html 整个项目的容器,也是根实例的模板
    - node_modules 整个项目的依赖包文件
    - src 源代码开发目录,也是开发者具体操作的目录
    - assets 开发环境的静态资源 , webpack编译
    - components 组件存放目录
    - xxx.vue 一个.vue文件就是一个组件,我们称之为:单文件组件(template js style)
    - App.vue 根实例的直接子组件,其他组件往App.vue中放
    - main.js 整个项目的入口文件
    - .babelrc 优雅降级
    - .editorconfig 编辑器配置文件
    - .gitignore 配置git上传时,不需要上传文件配置
    - postcssrc.js css预处理器的配置
    - display: flex;
    - -webkit
    - -moz
    - -ms
    • README.md 项目说明文件
      • static 生产环境的静态资源 webpack不编译

总结:

cli3 的 webpack 配置放在了node_modules 的 @vue/cli-server 中
cli2 的配置
standard build目录中
simple webpack.config.js

问题: 如果我们在cli3中要进行webpack配置,怎么办?
分析: cli3的基础webpack 配置我们不要动 , 将来node_modules会被删除
解决: 新建一个vue.config.js文件进行webpack的覆盖配置

### 如何查找 Vue CLI 的安装路径 Vue CLI 是通过 npm 全局安装的工具,因此其实际存储位置取决于 Node.js 和 npm 的配置环境。以下是关于如何定位 Vue CLI 安装路径的相关说明: #### 使用 `npm list` 查看全局安装路径 可以通过以下命令查看 Vue CLI 是否已成功全局安装以及具体的安装路径: ```bash npm list -g --depth=0 ``` 此命令会列出所有全局安装的 npm 包及其所在目录[^2]。 如果 Vue CLI 正常安装,则会在输出中显示类似于以下的内容: ``` /usr/local/lib ├── @vue/cli@5.0.8 └── ... ``` 上述路径中的 `/usr/local/lib` 就是 Vue CLI 的全局安装根目录。具体模块文件通常位于该路径下的 `node_modules/@vue/cli` 文件夹内[^1]。 --- #### 手动检查默认安装路径 Node.js 和 npm 的全局包默认安装路径可能因操作系统而异。可以使用以下方法确认当前系统的全局安装路径: ##### Windows 系统 在 Windows 上,默认情况下,npm 全局包会被安装到以下路径之一: - `%AppData%\npm\node_modules` - 或者由自定义设置指定的其他路径。 可以在命令提示符下执行以下命令来获取确切路径: ```bash npm config get prefix ``` 返回的结果通常是类似 `C:\Users\<用户名>\AppData\Roaming\npm` 的路径,其中 `node_modules` 子目录即为全局模块的位置。 ##### macOS/Linux 系统 在类 Unix 系统上,默认全局安装路径一般为: - `/usr/local/lib/node_modules` 或者如果是通过 nvm(Node Version Manager)管理的节点版本,则可能是: - `$HOME/.nvm/versions/node/<version>/lib/node_modules` 同样可通过以下命令验证: ```bash npm config get prefix ``` 结果将指向全局模块的实际父级目录。 --- #### 验证 Vue CLI 可执行文件的具体位置 无论在哪种平台上,Vue CLI 的核心可执行脚本实际上是链接至某个特定二进制文件。要找到这个文件的确切位置,可以直接运行以下命令: ```bash which vue ``` (适用于 Linux/macOS),或在 PowerShell/CMD 中输入: ```powershell Get-Command vue | Select-Object Source ``` 这一步骤能够帮助精确定位启动器脚本所在的绝对地址,比如 `/usr/local/bin/vue` 或 `C:\Users\<用户名>\AppData\Roaming\npm\vue.cmd`[^3]。 最终,这些脚本实际上是对前述提及的 `node_modules` 下对应模块的一个快捷方式引用。 --- ### 总结 为了查找出 Vue CLI 的安装路径,推荐优先采用 `npm list -g --depth=0` 方法快速浏览全局依赖列表;其次借助操作系统的特性查询相关联的可执行程序源码位置。以上过程均需确保 npm 工具本身正常运作无误。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值