今天给各位分享如何删除vue脚手架项目的知识,其中也会对删除vue脚手架项目命令进行解释,如果能碰巧解决你现在面临的问题,别忘了关注本站,现在开始吧!
本文目录一览:
Vue脚手架
在没有Vue脚手架的时候,我们需要手动搭建webpack项目、手动去配置vue,现在有了Vue脚手架,我们就可以通过命令行的形式快速生成vue项目的基础架构。其官网地址为:
安装 3.x 版本的 Vue 脚手架。
输入 vue -V 如果出现版本号,就说明安装成功。
脚手架安装成功之后,就可以通过脚手架创建vue项目了。
通过上面脚手架创建的Vue项目,使用 npm run serve 命令之后,打印如下:
使用 npm run serve 命令并不会自动打开浏览器,下面我们修改端口号,并且让执行命令之后自动打开浏览器。
注意: 不推荐使用这种配置方式。因为 package.json 主要用来管理包的配置信息,为了方便维护,推荐将 vue 脚手架相关的配置,单独定义到 vue.config.js 配置文件中。
总结 :至此,使用脚手架创建项目的流程就完成了,如果想要把项目拷贝给别人,需要先把项目的 node_modules 文件夹删除,对方拿到项目之后,首先要cd到项目目录,然后执行 npm install 安装所有依赖项,然后再执行 npm run serve 就可以把项目跑起来了。如果想要再给项目添加新的依赖,可以cd到项目目录,然后执行 vue ui 打开GUI,在可视化面板中就可以给项目添加新的依赖了。
vue2/vue3环境搭建
检查是否安装成功
Vue build == 打包方式,回车即可;
Install vue-router == 是否要安装 vue-router,项目中肯定要使用到 所以Y 回车;
Use ESLint to lint your code == 是否需要 js 语法检测 目前我们不需要 所以 n 回车;
Set up unit tests == 是否安装 单元测试工具 目前我们不需要 所以 n 回车;
Setup e2e tests with Nightwatch == 是否需要 端到端测试工具 目前我们不需要 所以 n 回车;
1、build:构建脚本目录
1)build.js == 生产环境构建脚本;
2)check-versions.js == 检查npm,node.js版本;
3)utils.js == 构建相关工具方法;
4)vue-loader.conf.js == 配置了css加载器以及编译css之后自动添加前缀;
5)webpack.base.conf.js == webpack基本配置;
6)webpack.dev.conf.js == webpack开发环境配置;
7)webpack.prod.conf.js == webpack生产环境配置;
2、config:项目配置
1)dev.env.js == 开发环境变量;
2)index.js == 项目配置文件;
3)prod.env.js == 生产环境变量;
3、node_modules:npm 加载的项目依赖模块
4、src:这里是我们要开发的目录,基本上要做的事情都在这个目录里。里面包含了几个目录及文件:
1)assets:资源目录,放置一些图片或者公共js、公共css。这里的资源会被webpack构建;
2)components:组件目录,我们写的组件就放在这个目录里面;
3)router:前端路由,我们需要配置的路由路径写在index.js里面;
4)App.vue:根组件;
5)main.js:入口js文件;
5、static:静态资源目录,如图片、字体等。不会被webpack构建
6、index.html:首页入口文件,可以添加一些 meta 信息等
7、package.json:npm包配置文件,定义了项目的npm脚本,依赖包等信息
8、README.md:项目的说明文档,markdown 格式
9、.xxxx文件:这些是一些配置文件,包括语法配置,git配置等
1.解决vue不能自动打开浏览器的问题:当我们输入npm run dev,运行项目,命令行提示我们运行成功,但是浏览器也没有自动打开,只能自己手动输入。
改完之后重启一下即可。
2.为了避免端口冲突,也可以修改port,打开目录同上
更改成功:
1. 如果你已经全局安装了旧版本的 vue-cli(1 或2),你需要先通过
npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸载它(卸载脚手架)
2.全局安装 npm install -g @vue/cli 或 yarn global add @vue/cli
3.全局安装了vue-cli3 但是还想用vue-cli2 ,添加一个桥接工具 命令:npm install -g @vue/cli-init
4.可以进行创建项目了
vue-cli2: 命令:vue init webpack my_project
vue-cli3 命令:vue create my-project
3.版本不同 安装方式也不同
vue-cli2: 命令 npm install -g vue-cli
vue-cli3: 命令 npm install -g @vue/cli
3.版本不同的创建项目方式不同
vue-cli2: 命令:vue init webpack my_project
vue-cli3 命令:vue create my-project
4.vue-cli2和vue-cli3 安装完后的 项目目录不一样
5.安装指定版本的vue
npm install -g @vue/ cli@3.12.1
vue-cli3.0项目目录结构
vue-cli2.0项目目录结构
vue-cli4.5.15 的vue2项目目录
vue安装脚手架时候怎么卸载全局变量
这个应该好理解啊,就像悬挑式脚手架,搭设高度不得超过20m,而这20m就可以看做一个分段,其受力卸载在底部悬挑梁上。部分卸载就是如果底部悬挑梁无法承受上部荷载时你可以使用斜拉钢丝绳卸载上部的荷载以分载。
vue项目脚手架改变为其他的,程序如何平移过去
vue项目脚手架改变为其他的,程序平移过去的方法为:
1、替换配置文件。
2、复制除了nodemodules以外的所有文件。
如何删除vue脚手架项目的介绍就聊到这里吧,感谢你花时间阅读本站内容,更多关于删除vue脚手架项目命令、如何删除vue脚手架项目的信息别忘了在本站进行查找喔。
2、本站永久网址:https://www.yuanmacun.com
3、本网站的文章部分内容可能来源于网络,仅供大家学习与参考,如有侵权,请联系站长进行删除处理。
4、本站一切资源不代表本站立场,并不代表本站赞同其观点和对其真实性负责。
5、本站一律禁止以任何方式发布或转载任何违法的相关信息,访客发现请向站长举报
6、本站资源大多存储在云盘,如发现链接失效,请联系我们我们会第一时间更新。
源码村资源网 » 如何删除vue脚手架项目(删除vue脚手架项目命令)
1 评论