zoukankan      html  css  js  c++  java
  • vue搭建手顺

    1、环境准备:node.js
      vue-cli: $ npm install vue-cli -g


    2、建立项目目录:vuedemo,并cd到该目录下


    3、$ vue init webpack
      vue-router yes


    4、webstorm打开该项目


    5、$ npm install axios -S
      新建目录src/api,并复制api.js文件到该目录
      config/index.js--01
      config/index.js--02


    6、$ npm install vuex -S
      复制src/vuex文件夹
      main.js import store from '@/vuex/store'; store


    7、$ npm install element-ui -S
      main.js----
      import ElementUI from 'element-ui';
      import 'element-ui/lib/theme-chalk/index.css';
      Vue.use(ElementUI);


    8、$ npm install d3 --save

    9、vue-router+布局
      5~8安装完成之后,复制src目录

    10、iconfont
      dev:index.html <link rel="stylesheet" href="http://at.alicdn.com/t/font_6666666_88888888888.css">
      build:main.js import './assets/iconfont/iconfont.css';


    ====build/utils.js
    if (options.extract) {
    return ExtractTextPlugin.extract({
    use: loaders,
    -----------------------
    publicPath: '../../',
    -----------------------
    fallback: 'vue-style-loader'
    })
    } else {
    return ['vue-style-loader'].concat(loaders)
    }
    ====config/index.js
    --01--dev-----
    proxyTable: {
    '/api': {
    target: 'http://localhost:8080/springmvc/',
    changeOrigin: true, // 必须,为true的话,请求的header将会设置为匹配目标服务器的规则(Access-Control-Allow-Origin)
    pathRewrite: {"^/api" : ""} //后面可以使重写的新路径,一般不做更改
    }
    }
    --02--dev----------
    port: 8888, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
    --03--build----------
    assetsPublicPath: './',
    staticPath: './static/',
    productionSourceMap: false,
    ====index.html
    添加网站icon,设置全局样式
    ----------------
    <link rel="shortcut icon" href="./static/xxx.ico" type="image/x-icon" />
    <title>数据管理系统</title>
    <style>
    html,body,#app {
    height: 100%;
    padding: 0px;
    margin: 0px;
    }
    </style>
    ====.babelrc
    compact:false(不压缩)
    ====


    src/assets/img
    <img src="@/assets/img/user.png" class="el-dropdown-link"/>
    static/temp
    src: './static/temp/xxx/015.jpg',


    ------------------------
    npm i prettier@~1.12.1

  • 相关阅读:
    React元素渲染
    初识JSX
    微信小程序复制文本到剪切板
    微信小程序报错request:fail url not in domain list
    小程序,通过自定义编译条件,模拟推荐人功能
    积分抵扣逻辑
    微信小程序 switch 样式
    tomcat 配置开启 APR 模式
    tomcat8 传输json 报错 Invalid character found in the request target. The valid characters are defined in RFC 3986
    c++数组初始化误区
  • 原文地址:https://www.cnblogs.com/floud/p/12105612.html
Copyright © 2011-2022 走看看