美文网首页
VUE项目构建

VUE项目构建

作者: 不会吃鱼的小猫 | 来源:发表于2018-08-27 11:36 被阅读0次

    1. 安装vue 和 vue脚手架构建工具(vue-cli)

    cnpm install -g vue
    cnpm install -g vue-cli

    2. 构建项目

    image.png
    • ject description (A Vue.js project) 项目描述 (A Vue.js project);
    • Author (XXXX XXXX@XXX.com) ;XXXX@XXX.com(项目作者);
    • Vue build ❯ Runtime + Compiler: recommended for most users
      Runtime-only: about 6KB lighter min+gzip, but templates (or any
      Vue-specific HTML) are ONLY allowed in .vue files - render functions
      are required elsewhere
      这里选择Runtime + Compiler: recommended for most
      users;
    • Install vue-router? (Y/n) 是否使用vue-router路由(y);
    • Use ESLint to lint your code? (Y/n) 是否使用ESLint(n);
    • Setup unit tests with Karma + Mocha? (Y/n) 是否需要单元测试(n);
    • Setup e2e tests with Nightwatch? (Y/n) 是否需要单元测试(n);

    3. 安装node

    npm install

    如果要使用less
    第一步:
    安装less依赖,npm install less less-loader --save
    第二步:
    修改webpack.config.js文件,配置loader加载依赖,让其支持外部的less,在原来的代码上添加
    {
    test: /\.less$/,
    loader: "style-loader!css-loader!less-loader",
    },
    现在基本上已经安装完成了,然后在使用的时候在style标签里加上lang=”less”里面就可以写less的代码了(style标签里加上 scoped 为只在此作用域 有效)
    (或者
    @import './index.less'; //引入全局less文件
    

    4. 运行

    npm run dev

    5. 跨域请求解决

    
    

    相关文章

      网友评论

          本文标题:VUE项目构建

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