记录接手一个 VUE项目的初始操作

背景

最近接受了一个前后端分离的项目，项目前端使用的是 vue.js. 接手项目之后，首先建议看一下 README.md 文件。一般情况下，项目的创建者都会大致写些东西在里面。

README.md 文件可能会有一下内容：

## Project setup
```
npm install
```### Compiles and hot-reloads for development
```
npm run serve
```### Compiles and minifies for production
```
npm run build
```### Run your tests
```
npm run test
```### Lints and fixes files
```
npm run lint
```

项目启动

npm install 这一步必不可少。环境准备完成之后，就可以执行 npm run serve 启动项目了。

在这里需要说明一下，一般情况下，使用什么执行脚本看你具体使用的是什么脚手架。我这里是因为有了项目说明，所以这么进行的流程。

项目配置文件

查找项目启动配置文件，比如是使用的什么工具启动的。这个一般是根据启动脚本来判断。我的这个项目根目录下有个 vue.config.js 文件，这个是配置文件。

module.exports = {publicPath: './',devServer: {open: true, // 默认打开浏览器proxy: {'/api': {target: 'http://localhost:8089',changeOrigin: true,pathRewrite: {'^/api': '/'}}}},//   lintOnSave：{ type:Boolean default:true } 问你是否使用eslintlintOnSave: true,// 如果您不需要生产时的源映射，那么将此设置为false可以加速生产构建productionSourceMap: process.env.NODE_ENV !== 'production',chainWebpack: (config) => {config.plugins.delete('prefetch');config.entry('index').add('babel-polyfill')}
}

项目启动配置

在 package.json 文件中找到了如下代码：

 "scripts": {"serve": "vue-cli-service serve","build": "vue-cli-service build","preProduction": "vue-cli-service build --mode preProduction","outTesting": "vue-cli-service build --mode outTesting","lint": "vue-cli-service lint"},

看到这里也就明白了为什么之前 npm run serve 这个脚本可以启动项目。也清楚了项目使用的 vue-cli 脚手架。那么 vue.config.js 文件里的配置就是按照 vue-cli 的规范来写的了。这里使用的 vue-cli 3.0版本。

记录接手一个 VUE项目的初始操作相关推荐

菜鸟运行第一个vue项目记录
近期打算着手重构现有的测试平台,由于现在用的平台是layui+flask+uwsgi+nginx框架大家都已经比较熟悉了.所以在新平台选型时本着让大家多接触新东西.新挑战的原则.平台重构选用的框架为v ...
使用webpack脚手架创建一个vue项目
使用webpack脚手架创建一个vue项目前言介绍前期环境准备开始创建项目实例交流前言介绍创建vue的项目方式有很多种,这里仅介绍使用webpack脚手架来创建一个vue项目,下面将创建 ...
VsCode创建第一个vue项目
转载自:https://www.cnblogs.com/z45281625/p/9015380.html VsCode创建第一个vue项目使用vue-cli快速构建项目 ( vue-cli 是vu ...
使用VSCode创建一个Vue项目
使用VSCode创建一个Vue项目 vue-cli 是vue.js的脚手架,用于自动生成vue.js模板工程的. 安装vue-cli之前,需要先安装了vue和webpack · node -v //( ...
多个vue项目合并成一个_零基础搭建一个Vue项目，你学会了吗？
这几天利用业余时间做了一个个人项目,后端部分已经搭建好了还差一个前端,经过考虑前端利用Vue来搭建开发,因对Vue不是很熟悉,所以利用网络查找了相关的资料,成功的跑出了第一个Vue页面,写在此作为一个 ...
Vue手把手带你入门(一) nodejs安装配置以及vue-cli脚手架创建第一个vue项目（超级详细）
开发Vue程序的第一步就是PC安装配置node.js 1官网下载安装Node(我的安装路径是D:\nodejs\) 点我安装(安装在除C盘外任意一个磁盘中) 2 检查node和npm是否安装完成下载 ...
从零开始创建一个vue项目 1
从零开始创建一个vue项目创建空文件夹,存放相关目录,cmd进入命令行 vue init webpack token 创建项目(除eslint,其它都yes) 打包配置config下面的index. ...
从零开始搭建一个vue项目 -- vue-cli/cooking-cli（一）
从零开始搭建一个vue项目 -- vue-cli/cooking-cli(一) 1.vue-cli搭建一个可靠成熟的项目 1.介绍 vue-cli 我是去年六月份接触的vue1.0,当时还是个菜逼,当 ...
vue请求在退出页面还执行吗_如何用 Cloudbase Framework 部署一个 Vue 项目
无需修改业务代码,就能将 Vue 应用前后端一键托管部署在云开发平台~ Cloudbase Framework 是云开发官方出品的前后端一体化部署工具.目前已经开源 . 关于 Cloudbase F ...

记录接手一个 VUE项目的初始操作

背景

项目启动

项目配置文件

项目启动配置

记录接手一个 VUE项目的初始操作相关推荐

最新文章

热门文章