使用npm安装vue脚手架

爱吃猫的鱼-

已于 2022-07-27 16:07:05 修改

阅读量7.6k

点赞数 12

分类专栏：前端文章标签： vue.js npm javascript

于 2022-07-26 14:10:30 首次发布

本文链接：https://blog.csdn.net/Zsl9998/article/details/125993592

版权

4 篇文章 0 订阅

订阅专栏

通过npm安装vue脚手架

安装node.js node.js中集成npm 下载地址：node下载连接
下载好后可以通过cmd命令查看是否安装成功
安装cnpm（可选）
由于有些npm资源被屏蔽或者是国外资源的原因，经常会导致npm安装依赖包的时候失败，所以我们也可以使用npm的国内镜像——cnpm（淘宝npm）
npm install -g cnpm --registry=https://registry.npm.taobao.org

切换到指定目录
创建项目
配置项目
是上下进项选择，回车进行确认
选择需要配置项目

配置项说明：
( ) Babel//转码器，可以将ES6代码转为ES5代码，从而在现有环境执行。
( ) TypeScript// TypeScript是一个JavaScript（后缀.js）的超集（后缀.ts）包含并扩展了 JavaScript 的语法，需要被编译输出为 JavaScript在浏览器运行
( ) Progressive Web App (PWA) Support// 渐进式Web应用程序
( ) Router // vue-router（vue路由）
( ) Vuex // vuex（vue的状态管理模式）
( ) CSS Pre-processors // CSS 预处理器（如：less、sass）
( ) Linter / Formatter // 代码风格检查和格式化（如：ESlint）
( ) Unit Testing // 单元测试（unit tests）
( ) E2E Testing // e2e（end to end) 测试
选择Vue版本
选择ESLint代码校验规则
选择如何存放位置

In dedicated config files // 独立文件放置
In package.json // 放package.json里
是否存储当前配置
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-HQJrclvv-1658815734006)(https://s2.loli.net/2022/07/26/9fiNS28MJWRHyOK.png)]
创建项目
启动项目
切换目录——运行服务
终止Vue项目
连续按两次ctrl+c 或者将命令行窗口关闭

项目结构说明：

- public一般不用动，在vue-cli在进行build的时候，public下面的文件会原封不动的添加到dist中，不会被合并、压缩；不会被webpack打包工具所处理。

来源和版本号

- public一般不用动，在vue-cli在进行build的时候，public下面的文件会原封不动的添加到dist中，不会被合并、压缩；不会被webpack打包工具所处理。
- src/assets目录，build之后，assets目录中的文件，会被合并到一个文件中，然后进行压缩。多用来存放业务级的js、css等。