前端:搭建vscode+vue+element环境
一、vue1.安装最新的node.js
2.安装vue-cli脚手架构建工具
在命令行中运行命令
2.安装vue-cli脚手架构建工具
在命令行中运行命令
npm install -g vue-cli
3.进入项目文件夹存放目录,创建项目(vue init webpack firstVue),其中firstVue是项目文件夹的名称,选项除了vue-router全部选No。
cd D:ProjectssoftwareEproject vue init webpack firstVue //firstVue是项目文件夹的名称,选项除了vue-router全部选No。
4.cd到项目文件夹(firstVue文件夹),然后运行命令 npm install ,安装依赖
cd D:ProjectssoftwareEprojectfirstVue
npm install
5.如果npm安装依赖失败,则返回最初的系统用户目录,安装cnpm(国内的)。若成功,则直接进入步骤7。
npm install -g cnpm --registry=http://registry.npm.taobao.org
cd D:ProjectssoftwareEprojectfirstVue cnpm install
7.运行项目(进入项目文件夹):cnpm run dev, 浏览器打开http://localhost:8080,查看项目的运行结果
cd D:ProjectssoftwareEprojectfirstVue cnpm run dev
【备注】1.这里是使用 CLI 构建出来的 Vue 项目。
2.cnpm和npm用一个即可,尽量不要混用。
3.start 即是执行
npm run dev
命令(查看package.json中的scripts可知)(参考:https://blog.csdn.net/mao834099514/article/details/79138484)
二、vscode
1.安装vscode
2.在vscode中添加插件vetur
1.安装vscode
2.在vscode中添加插件vetur
三、集成element
1.安装elenment-ui
1.安装elenment-ui
命令行进入到项目根目录输入cnpm i element-ui -S,安装完成之后,package.json文件会增加element-ui依赖(dependencies中)
cnpm i element-ui -S
2.用完整引入方式在main.js中写入以下内容:
import ElementUI from 'element-ui' //引入js import 'element-ui/lib/theme-chalk/index.css'//引入css Vue.use(ElementUI)
3. 运行项目:安装依赖 cnpm install,运行 cnpm run dev,浏览器打开http://localhost:8080
cd D:ProjectssoftwareEprojectfirstVue cnpm install cnpm run dev
后端: