Vue Cli新建项目，常用命令集合

windows中vscode无法执行yarn或cnpm时
用管理员身份打开powershell输入 set-ExecutionPolicy RemoteSigned 即可

vue init webpack my-project

使用yarn

npm install -g yarn(先删除node_modules和package.lock.js)
npm init                                              ---- yarn init
npm install                                         ---- yarn 
npm install xxx@1.1.1 -g                   ---- yarn global add xxx@1.1.1
npm install xxx@1.1.1 --save            ---- yarn add xxx@1.1.1
npm install xxx@1.1.1 --save-dev     ---- yarn add xxx@1.1.1 --dev
npm uninstall xxx --save(-dev)          ----yarn remove xxx
npm run xxx                                      ---- yarn run xxxx

yarn add less less-loader --dev
yarn add babel-plugin-import --dev

使用vant

npm i vant -S
适配rem,采用flexible
npm install postcss-pxtorem --save-dev

在postcss.config.js中，粘贴
module.exports = {
  plugins: {
    'autoprefixer': {
      browsers: ['Android >= 4.0', 'iOS >= 7']
    },
    'postcss-pxtorem': {
      rootValue: 37.5,
      //这是基准值，在375px的屏幕变大rem的值会变大，小于这个大小元素的rem值会变小
      propList: ['*']
    }
  }
  }

全局less

yarn add sass-resources-loader
然后在build 的utils.js中exports.cssLoaders = function (options) {}中加上一下代码：

function lessResourceLoader() {
        var loaders = [
            cssLoader,
            'less-loader',
            {
                loader: 'sass-resources-loader',
                options: {
                    resources: [
                        path.resolve(__dirname, '../src/assets/styles/common.less'),
                    ]
                }
                        }
        ];
        if (options.extract) {
            return ExtractTextPlugin.extract({
                use: loaders,
                fallback: 'vue-style-loader'
            })
        } else {
            return ['vue-style-loader'].concat(loaders)
        }
    }

return{} 块中的 less: generateLoaders(‘less’) 替换成less: lessResourceLoader()

格式化代码

    // 更改vue的html格式，根据需求设置
    "vetur.format.defaultFormatter.html": "js-beautify-html",
    // 更改vue的js格式
    "vetur.format.defaultFormatter.js": "vscode-typescript",
    // 保存时自动格式化
    "editor.formatOnSave": true,
    // 取消html标签属性强制换行
    "vetur.format.defaultFormatterOptions": {
        "js-beautify-html": {
            "wrap_attributes": "auto",
        }
    },