webpack 初始化 vue 项目

初始化 element 项目（使用 webpack 模板）

txt

1. 选择webpack模板, 根据提示设置配置，回车
$ vue init webpack {project name}

1. 进入创建的工程目录
$ cd {project name}

1. 添加 element-plus 到工程
$ vue add element-plus

1. 安装所有依赖包（npm install亦同）
$ npm install

1. 测试初始化工程, 浏览器访问（更多命令参考生成的README文件）
$ npm run dev

安装npm-check, 用来检查npm依赖包是否有更新
$ npm install -g npm-check

通过 npm-check 一次性升级所有全局包或项目依赖包的版本 https://blog.csdn.net/pcaxb/article/details/81773475 谨慎操作，可能导致包版本不兼容，启动失败

常见命令

txt

1. 运行项目
$ npm run dev

2. 强制清理
$ npm cache clean --force

3. 升级npm的版本到最新版（到指定版本）
$ npm install -g npm
$ npm install -g npm@6.14.4

4. 查看当前使用组件的版本
$ npm list element-ui

5. 升级组件到最新版（指定版本）
$ npm update element-ui --save
$ npm update element-ui@2.13.0 --save

6. 卸载组件
$ npm uninstall element-ui

7. 列举包可使用的版本
$ npm view element-ui versions

8. 安装常用组件
$ npm install element-ui --save
$ npm install vue-router --save
# vuex 依赖 Promise, 需要es6-promise, 在使用 Vuex 之前的一个地方import 'es6-promise/auto'后，window.Promise 会自动可用
$ npm install es6-promise --save
$ npm install vuex --save
$ npm install dayjs --save
$ npm install axios --save
# 增加了一些安全性的查询字符串解析和序列化字符串的库
$ npm install qs --save

9. 在src目录下创建名字为router的目录，然后在router文件夹下创建index.js

webpack 初始化 vue 项目 ​

常见命令 ​

webpack 初始化 vue 项目

常见命令