新建VUE 2.0 项目及引入Element UI 步骤及常见问题

醉酒当歌 提交于 2019-11-27 20:22:39

新建Vue项目:

淘宝镜像(npm install -g cnpm –registry=https://registry.npm.taobao.org

webpack(cnpm install webpack -g 或 npm install webpack -g)

Vue脚手架 (npm install vue-cli -g)

根据模版创建项目 (vue init webpack-simple 注:不能为中文) 此时会让你进行一些初始化的设置 全选Y 和回车 即可

安装项目依赖 (npm install 注:不要从国内镜像cnpm安装(会导致后面缺了很多依赖库))

启动项目 (npm run dev)

常见问题

1.端口问题

nowa和新建项目的端口都是 8080

报错:     throw er; // Unhandled 'error' event

修改  config/index.js 中的端口  8081 8082。。

引入Element UI:

安装 Element UI (cnpm install element-ui@next -S)

main.js 引入

import Element from ‘element-ui’
import ‘element-ui/lib/theme-default/index.css’
Vue.use(Element)

读取CSS 字体

cnpm install style-loader –save-dev
cnpm install css-loader –save-dev
cnpm install file-loader –save-dev

添加 webpack.base.conf.js配置

 {
        test: /\.css$/,
        loader: 'style-loader!css-loader',
        include: [
          /src/
        ]
      },
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!