VUE项目创建过程及本地运行

VUE创建过程

0)、安装 Node.js

1)、安装环境:(安装淘宝镜像、webpack、vue-cli)

npm install -g cnpm --registry=http://registry.npm.taobao.org
npm install webpack -g
npm install vue-cli -g

2)、创建项目:<工程名字不能用中文>

vue init webpack-simple 工程名字

3)、安装vue路由模块和网络请求模块:

npm install vue-router vue-resource --save

4)、启动项目:(进入项目、安装项目依赖、运行项目)

cd 工程名字
npm install
npm run dev

VUE运行(VSCode编辑器)
1). 安装 BrowserSync
npm install -g browser-sync
2). 启动 BrowserSync
静态网站:
// –files 路径是相对于运行该命令的项目(目录)
browser-sync start –server –files “css/.css, .html”
// 如果你的文件层级比较深,您可以考虑使用 **(表示任意目录)匹配,任意目录下任意.css 或 .html文件。
browser-sync start –server –files “/.css, /.html”

一般用到的vue插件安装

安装vue element UI
npm i element-ui -S
安装axios
先安装!
npm install axios
然后!
npm install –save axios vue-axios
安装less
1.npm install less less-loader –save-dev
2、在style中声明lang=”less”。 注意: scoped的作用仅仅是限定css的作用域,防止变量污染。
3、这样就可以根据less的语法使用了。
安装vue-scroller
npm install vue-scroller -D
安装vux

npm install vux –save

具体查看https://doc.vux.li/zh-CN/install/npm.html

Logo

前往低代码交流专区

更多推荐