第一种:引入方式就是正常的路由引入方式constrouter=newRouter({routes:[{path:'/hyh',component:hyh,name:'hyh'}]}) 第二种:constrouter=newRouter({routes:[{path:'/index',component:(re...

现在开始安装环境一.安装node.js首先要安装node.js,去nodejs官网下载即可，地址：http://nodejs.cn/中文网。安装完成后，打开终端（windows键+R）搜索cmd,输入命令行node-v 和 npm-v，如果能显示出版本号，就说明安装成功。二.安装vue-cli输入命...

（1）图片处理　　首先回顾下图片引入方式1、js创建图片引入2、css结合背景图background-image:url('')引入3、图片标签引入<imgsrc="">""/>　　1、首先在js里创建图片插入　　   　　接着进行打包输出，测试如下　　  ...

（1）ES6语法解析转换ES5　　为了方便测试，我们先将mode模式改为开发模式development，首先编写ES6语法进行相关测试　　　　然后打包测试，发现打包后的js文件仍旧是ES6语法　　 　　接下来安装相关依赖npmibabel-loader@babel/core@babel/preset-env-...

（1）打包后的文件分析　　首先将打包后的文件进行适当删减，Ctrl+Shift+L可以同时选中所有相同结构内容　　结构如下(function(modules){...})({...})　　分析可知本质为匿名函数即IIFE函数，执行时会传入后面函数执行符里的对象，接下来分析下传入对象　　对象构成：　　key指的是当前模块...

Commonjs模块化打包　　　　 　　接下来进行打包验证npxwebpack，输出结果部分如下　　　　然后执行测试下打包输出文件main.js，这里测试有两者方法　（1）直接使用node环境测试nodemain.js　　   （2）新建html文件，引入js脚本然后启动验证　　...

（1）简介　　　　可以做的事情1、代码转换：将ES6转为ES5；将CSS、Less、Sass等转化为CSS；2、文件优化：文件打包过程里压缩代码体积，合并文件3、代码分割：公共模块的抽离、路由懒加载4、模块合并：按照功能分类，将多个模块合并为一个模块5、自动刷新：启动webpack服务，实现代码变更后的自动刷新，即热更...

最近在学习webpack过程中，根据官方文档推荐局部安装webpack，执行webpack-h命令出现以下提示npminstallwebpack-cli-D提示在开发环境中局部安装webpack-cli成功安装webpack-cli后，运行webpack-h还是提示说明webpack命令还是没有成功执行不知道什么情况在...

（1）编译ES6----测试后有问题，先继续往下　　使用webpack配合babel打包编译ES6/ES7　　1、Babel是应用比较广泛的编译工具2、在webpack使用时需要借助babel-loader，之前提到过，在webpack中编译处理静态文件，都会用到loader。而babel-loader是一款编译性质的...

（1）背景　　  　　作者受Google工具的模块分割影响有了创作灵感　　　　　　随着SPA的推广，前端应用复杂度快速提升。　　 　　   　　   　　MVC时代便有了模块化的初期思想　　 　　三大框架便将模块化概念推...

（1）webpack作用　　  　　1、前端为什么需要webpack？现在的前端网页功能丰富，特别是SPA（singlepagewebapplication单页应用）技术流行后，JavaScript的复杂度增加和需要一大堆依赖包，还需要解决SCSS，Less……新增样式的...

安装错误情形下面汇总了安装过程中可能出现的一些常见问题：情形一：Package Control：Therearenopackagesavailableforinstallation  据StackOverflow上说是IPv6造成，如果我们的Intent服务提供者（ISP）不支持IPv6就...

先不要着急看锁文件作用，我们一步一步来看它的形成（1）初始化项目　　npminit[--yes]表示跳过导航阶段　　  　　关于详细的npm用法，详见下节文章npm模块管理器所以，当我们使用npminit初始化项目时，便生出了package.json项目说明文件　　除此之外，还拓展了关于script...

本文转自阮一峰老师教程，链接：http://javascript.ruanyifeng.com/nodejs/packagejson.html#概述scripts字段dependencies字段，devDependencies字段peerDependenciesbin字段main字段config字段其他browser字...

npm不仅可以用于模块管理，还可以用于执行脚本。package.json文件有一个scripts字段，可以用于指定脚本命令，供npm直接调用。    接下来做个简单测试：（1）在项目根目录下创建demo.js   接下来运行demo.js，直接运行如...