搭建Vue项目【最后附Mint】

vue文档:https://cn.vuejs.org/v2/guide/

1、检查npm和node版本

node.js下载地址:http://nodejs.cn/download/

图1 查看版本号

2、全局安装vue-cli

命令【npm install --global vue-cli】

图2 搭建全局vue脚手架

3、进入你的项目目录,创建一个基于 webpack 模板的新项目

命令【vue init webpack 190926mint】

图3 新建vue项目

4、进入项目,启动项目命令【npm run dev】

浏览器输入:http://localhost:8080

图4-1 启动成功后返回项目地址

图4-2 项目执行成功预览页面

***5、项目加 Mint UI

文档:http://mint-ui.github.io/docs/#/zh-cn2/

步骤一:安装Mint UI。

npm 安装

推荐使用 npm 的方式安装,它能更好地和webpack打包工具配合使用。

命令【npm i mint-ui -S】

完整引入

在 main.js 中写入以下内容:

import Vuefrom 'vue'

import MintUI from 'mint-ui'

import 'mint-ui/lib/style.css'

import Appfrom './App'

import routerfrom './router'

Vue.config.productionTip =false

Vue.use(MintUI)

/* eslint-disable no-new */

new Vue({

el:'#app',

  router,

  components: { App },

  template:''

})

以上代码便完成了 Mint UI 的引入。需要注意的是,样式文件需要单独引入。

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容