Vue开始一个项目

1.创建Vue 项目

 

vue init webpack name 

2.安装常用依赖

  根据需求安装常用依赖:router(路由) axios(交互) vuex(状态管理) less, sass(css预处理器) fastclick (处理移动端click事件300毫秒延迟)

npm i -S vue-router axios vue-axios vuex less less-loader fastclick

 

  less 依赖需要在build/webpack.config.js 下配置:

{
    test: /\.less$/,
    loader: "style-loader!css-loader!less-loader"
}

 自定义公用的 less文件,主要用到less的变量,  如何全局使用这些变量 ,修改: build/utils.js   

修改 less: generateLoaders('less'), //需要安装 npm install -D sass-resources-loader
less: generateLoaders('less').concat({
     loader: 'sass-resources-loader',
       options: {
         resources: path.resolve(__dirname, '../src/common/css/index.less') // 根据自己地址来
       }
    }),

   less 依赖的使用 添加lang:

<style lang="less">
body{color:@color-bg}
</
style>

  fastclick 依赖的引入和使用

import FastClick from 'fastclick'
FastClick.attach(document.body)

3.修改eslintrc.js: 修改一些es6语法检查过滤项    es6语法规则 

  最好统一一个规范

"indent":0, // 缩进
"space-before-function-paren":["error","never"], // 在函数括号之前需要或不允许空格,never 绝不
"no-tabs":'off', // 禁止所有标签
"no-unused-expressions": 0 // 短路求值和三目运算都允许

4.Vue风格指南

 

 

 

posted @ 2019-05-08 17:19  虔诚_k  阅读(296)  评论(0编辑  收藏  举报