<template><div class="stars"><div v-for="(item,ind) in num" :key="ind" :class="{‘on‘:ind<=cur}" @mouseover=‘enter(ind)‘@mouseleave="out()"@click="ok(ind)"></div></div>
</template>
<script>export default{name:‘Star‘,data(){return{num:5,cur:-1,flag:false}},methods:{enter(ind){if(!this.flag){this.cur=ind;}},out(){if(!this.flag){this.cur=-1;}},ok(ind){this.flag=true;this.cur=ind; }}}
</script>
<...
1、查看node 版本node -v 2、安装vue-cli，如果安装不了，需要安装淘宝镜像npm install --global vue-cli 3、选择开发目录，初始化项目vue init webpack 项目名称 4、运行即可 原文：https://www.cnblogs.com/shuajing/p/14011426.html
好久没有写笔记了,看着以前写的笔记有很多不合理的地方也没有去改正,这里抽空记录一个vue-cli莫名其妙的警告,虽然现在我也是一脸懵逼,但是还好把问题处理了.出现的的问题是:项目运行时出现警告This relative module was not found:* ./Home/HomePage/HomePage.less in ./src/components lazy ^\.\/.*$,但是less是起作用了的.这个问题百度也没有百度出来,折腾了半天,只好自己想办法,还好在群里热心大佬们耐心的帮我找问题,给了我很多...
有了eslint的校验，可以来规范开发人员的代码，是挺好的。但是有些像缩进、空格、空白行之类的规范，在开发过程中一直报错，有点烦人了。我们可以在创建工程的时候选择不要安装eslint。就是在安装工程的时候，出现【Use ESLint to lint your code?】时选择【No】即可。如果你已经安装过了，我们可以直接关闭它。关闭eslint的方法：1.项目根目录 ---> build ---> webpack.base.conf.js 注释掉如下的代码 2.重启编辑器，再运行npm ru...
1、大文件定位 我们可以使用webpack可视化插件Webpack Bundle Analyzer 查看工程js文件大小，然后有目的的解决过大的js文件。 安装：npm install --save-dev webpack-bundle-analyzer 在webpack中设置如下，然后npm run dev 的时候默认会在8888端口显示const BundleAnalyzerPlugin = require(‘webpack-bundle-analyzer‘).BundleAnalyzerPlugin;module.exports = {plugins: [new BundleAnalyzerPlugin()]
}2、使用cdn ...
vue-cli项目打包：1. 命令行输入：npm run build 打包出来后项目中就会多了一个文件夹dist，这就是我们打包过后的项目。第一个问题，文件引用路径。我们直接运行打包后的文件夹中的index.html文件，会看到网页一片空白，f12调试，全是css，js路径引用错误的问题。解决：到config文件夹中打开index.js文件。文件里面有两个assetsPublicPath属性，更改第一个，也就是更改build里面的assetsPublicPath属性：assetsPublicPath属性...
vue-cli脚手架模板是基于node下的npm来完成安装的所以首先需要安装node1、安装node，vue运行需要基于npm一定的版本，所以首先升级npm到最新的版本，而在安装的过程中个人比较喜欢淘宝的镜像，所以先安装cnpm（因为速度和稳定性都比较好）2、在目标文件夹下打开终端3、执行cnpm install vue-cli -g 全局安装 运行vue查看安装是否成功 4、运行vue init webpack(注：模板名称) sell2(注：项目名称) 5、进入项目文件夹下执行 cnpm i...
最近在学习使用vue，简单汇总下如何使用vue-cli脚手架自动化搭建一个vue项：1.首先，要安装node.js，之后第一步检测是否安装node；没有安装node的同学请到官网下载安装 https://nodejs.org/en/download/安装成功后在命令行查看node版本，如果有说明安装成功。 2.之后全局安装vue-cli脚手架电脑进入cmd，任意路径下 使用 npm命令：npm install vue-cli -g注意：npm -v 3.0+ npm版本需要在3.0之上 3.之后在你想要的工程目录下：使用...
{// 此项指明，转码的规则"presets": [// env项是借助插件babel-preset-env，下面这个配置说的是babel对es6,es7,es8进行转码，并且设置amd,commonjs这样的模块化文件，不进行转码["env", {"modules": false,"targets": {"browsers": ["> 1%", "last 2 versions", "not ie <= 8"]}}],// 下面这个是不同阶段出现的es语法，包含不同的转码插件"stage-2"],// 下面这个选项是引用插件来处理代码的转换，transform-runtime用来处理全局函...
做了一个demo，想看一下打包之后的样子，发现页面是空的。发现问题就要解决：1.首先看控制台没有报任何错误，那就证明我们的代码是没有任何问题的。只能是路径问题造成的。2.在路由router/index.js中加入一个404页面,代码引入创建之类的就不说了。也就是说只要路径错误，Error这个vue组件就会显示{path: ‘*‘,name: ‘404‘,component: Error,hidden: true}3.再打包，发现新增的Error果然出现。4.再次证明是路径问题，想到路由有个...
Vue Cli 3 官方文档：https://cli.vuejs.org/zh/guide/ 一、安装 @vue/cli更新到 3.x 之后，vue-cli 的包名从 vue-cli 改成了 @vue/cli如果之前全局安装了旧版本的 vue-cli (1.x 或 2.x)，首先需要使用以下命令卸载掉// 如果没有安装旧版本的 vue-cli 可以跳过卸载直接安装npm uninstall vue-cli -g
# OR
yarn global remove vue-cli 然后重新安装新版本的 @vue/clinpm install -g @vue/cli
# OR
yarn global add @vue/cli安装...
Vue是近两年来比较火的一个前端框架（渐进式框架吧）。 Vue两大核心思想：组件化和数据驱动。组件化就是将一个整体合理拆分为一个一个小块（组件），组件可重复使用；数据驱动是前端的未来发展方向，释放了对DOM的操作，让DOM随着数据的变化自然而然的变化（尤神原话），不必过多的关注DOM，只需要将数据组织好即可。本文用Vue-cli从零开始搭建一个Vue项目。准备工作1、下载安装Node.js 下载地址：https://nodejs.org/en/downlo...
参考文章： https://segmentfault.com/q/1010000008832754原文：http://www.cnblogs.com/zhuzhenwei918/p/6943147.html
什么是脚手架？可以快速生成新项目的目录模板(Node.js)，将复杂的前端项目分成多个系统化的模块，便于管理和编辑，简化开发的软件。什么是Vue-CLI？是一个基于 Vue.js 进行快速开发的完整系统，一种交互式的项目脚手架，用于自动生成vue.js+webpack的项目模板（要使用此脚手架必须先准备vue,vue-cli，webpack，node等一些必要的环境）。什么是webpack?WebPack可以看做是模块打包机：它做的事情是，分析你的项目结构，找到JavaScrip...
出处：https://github.com/ZSI2017/blog/issues/14yorkie 的 github：https://github.com/yyx990803/yorkiepre-commit钩子，代码质量检查：在 vue-cli 3.x 版本中，已经使用尤大改写的yorkie，yorkie实际是fork husky，然后做了一些定制化的改动，使得钩子能从package.json的 "gitHooks"属性中读取原文：https://www.cnblogs.com/cag2050/p/10518074.html
