美文网首页
vue-cli+webpack+element-ui

vue-cli+webpack+element-ui

作者: 正版Figo | 来源:发表于2018-11-16 00:20 被阅读0次

    1、安装淘宝镜像

    cnpm  config set registry https://registry.npm.taobao.org --global
    

    2、安装脚手架

    sudo npm install --global  vue-cli
    

    sudo权限安装,需要输入开机密码
    没有sudo报错的原因:

    Error: EACCES: permission denied, mkdir 
    

    //权限被拒绝
    解决:权限安装--因为是mac系统,需要先获取权限,输入 sudo-s。然后会出现要求你输入密码,password为你自己设置的开机密码

    3、安装全局webpack

    sudo nom i webpack -g
    sudo nom I webpack-cli -g
    

    4、创建项目

    vue init webpack my-project
    

    注意:项目名不能有大写

    “Project name”:这个是项目名称,默认是输入时的那个名称,想改的话直接输入修改,也可以直接回车

    “Install vue-router”:是否需要vue-router,这里默认选择使用,这样生成好的项目就会有相关的路由配置文件

    “Use ESLint to lint your code”:是否使用ESLint,刚才说了我们这个项目需要使用所以也是直接回车,默认使用,这样会生成相关的ESLint配置

    “Setup unit tests with Karma + Moch?”: 是否安装单元测试。由于我们现在还没有单元测试,所以这里选择的是”N”,而不是直接回车

    “Setup e2e tests with Nightwatch”:是否安装e2e测试,这里我也同样选择的是“N”

    5、进入项目

    cd my-project 
    

    6、初始化项目

    npm install
    

    7、安装

    nom i vue-router --sava-dev
    

    8、安装饿了吗

    npm i element-ui -S
    

    9、运行项目

    npm run dev
    

    (创建完成)


    借助 babel-plugin-component,我们可以只引入需要的组件,以达到减小项目体积的目的。

    首先,安装 babel-plugin-component:
    npm install babel-plugin-component -D

    主题安装
    npm i element-theme -g

    从 npm

    npm i element-theme-chalk -D

    从 GitHub

    npm i https://github.com/ElementUI/theme-chalk -D

    官网介绍:http://element-cn.eleme.io/#/zh-CN/component/custom-theme

    相关文章

      网友评论

          本文标题:vue-cli+webpack+element-ui

          本文链接:https://www.haomeiwen.com/subject/pzxefqtx.html