51
Dev开发社区
首页
文章
问答
工具
搜索
登录
注册
#webpack
webpack-dev-server不是内部或外部命令
参考:https://segmentfault.com/q/1010000006939078错误报告:webpack-dev-server不是内部或外部命令错误原因:当执行命令:npmrundev 实际执行的是package.json配置:"dev":"webpack-dev-server--in...
代码星球
·
2020-04-10
webpack-dev-server
不是
内部
外部
命令
vue开发工具node.js及构建工具webpack
1.概念 node.js:可以运行JavaScript的服务平台,可以把它当做一个后端程序,只是它的开发语言是JavaScript (通常情况下,JavaScript的运行环境都是浏览器,因此JavaScript的能力也就局限于浏览器能赋予它的权限了。比如说读写本地系统文件这种操作,一般情况下运行在浏览器中的Jav...
代码星球
·
2020-04-10
vue
开发工具
node.js
构建
工具
vue+webpack 实现懒加载的三种方式
第一种:引入方式就是正常的路由引入方式constrouter=newRouter({routes:[{path:'/hyh',component:hyh,name:'hyh'}]}) 第二种:constrouter=newRouter({routes:[{path:'/index',component:(re...
代码星球
·
2020-04-08
vue+webpack
实现
加载
三种
方式
快速搞定用Vue+Webpack搭建前端项目(学习好久了,该写点东西了......)
现在开始安装环境一.安装node.js首先要安装node.js,去nodejs官网下载即可,地址:http://nodejs.cn/中文网。安装完成后,打开终端(windows键+R)搜索cmd,输入命令行node-v 和 npm-v,如果能显示出版本号,就说明安装成功。二.安装vue-cli输入命...
代码星球
·
2020-04-08
快速
搞定
Vue+Webpack
搭建
前端
webpack4+(图片处理、打包文件分类、打包多页应用)
(1)图片处理 首先回顾下图片引入方式1、js创建图片引入2、css结合背景图background-image:url('')引入3、图片标签引入<imgsrc="">""/> 1、首先在js里创建图片插入 接着进行打包输出,测试如下 ...
代码星球
·
2020-04-08
打包
webpack4+
图片
处理
文件
webpack4+(ES6语法转化、处理JS语法及校验、全局变量引入)
(1)ES6语法解析转换ES5 为了方便测试,我们先将mode模式改为开发模式development,首先编写ES6语法进行相关测试 然后打包测试,发现打包后的js文件仍旧是ES6语法 接下来安装相关依赖npmibabel-loader@babel/core@babel/preset-env-...
代码星球
·
2020-04-08
语法
webpack4+
ES6
转化
处理
webpack4+(打包后的文件分析+脚本打包+HTML插件+样式处理CSS+Less+css抽离压缩)
(1)打包后的文件分析 首先将打包后的文件进行适当删减,Ctrl+Shift+L可以同时选中所有相同结构内容 结构如下(function(modules){...})({...}) 分析可知本质为匿名函数即IIFE函数,执行时会传入后面函数执行符里的对象,接下来分析下传入对象 对象构成: key指的是当前模块...
代码星球
·
2020-04-08
打包
webpack4+
后的
文件
分析
webpack测试打包文件的两种方式
Commonjs模块化打包 接下来进行打包验证npxwebpack,输出结果部分如下 然后执行测试下打包输出文件main.js,这里测试有两者方法 (1)直接使用node环境测试nodemain.js (2)新建html文件,引入js脚本然后启动验证 ...
代码星球
·
2020-04-08
webpack
测试
打包
文件
两种
webpack4+(简介+基础配置+配置文件名)
(1)简介 可以做的事情1、代码转换:将ES6转为ES5;将CSS、Less、Sass等转化为CSS;2、文件优化:文件打包过程里压缩代码体积,合并文件3、代码分割:公共模块的抽离、路由懒加载4、模块合并:按照功能分类,将多个模块合并为一个模块5、自动刷新:启动webpack服务,实现代码变更后的自动刷新,即热更...
代码星球
·
2020-04-08
配置
webpack4+
简介
基础
文件名
安装webpack-cli与webpack版本问题
最近在学习webpack过程中,根据官方文档推荐局部安装webpack,执行webpack-h命令出现以下提示npminstallwebpack-cli-D提示在开发环境中局部安装webpack-cli成功安装webpack-cli后,运行webpack-h还是提示说明webpack命令还是没有成功执行不知道什么情况在...
代码星球
·
2020-04-08
安装
webpack-cli
webpack
版本
问题
Webpack 3.0 前端工程化(编译ES6/ES7、编译TypeScript、打包提取公共代码、代码分割和懒加载)
(1)编译ES6----测试后有问题,先继续往下 使用webpack配合babel打包编译ES6/ES7 1、Babel是应用比较广泛的编译工具2、在webpack使用时需要借助babel-loader,之前提到过,在webpack中编译处理静态文件,都会用到loader。而babel-loader是一款编译性质的...
代码星球
·
2020-04-08
编译
代码
Webpack
前端
工程化
Webpack 3.0 前端工程化(背景、模块化、环境准备)
(1)背景 作者受Google工具的模块分割影响有了创作灵感 随着SPA的推广,前端应用复杂度快速提升。 MVC时代便有了模块化的初期思想 三大框架便将模块化概念推...
代码星球
·
2020-04-08
Webpack
前端
工程化
背景
模块化
浅谈webpack3.0+
(1)webpack作用 1、前端为什么需要webpack?现在的前端网页功能丰富,特别是SPA(singlepagewebapplication单页应用)技术流行后,JavaScript的复杂度增加和需要一大堆依赖包,还需要解决SCSS,Less……新增样式的...
代码星球
·
2020-04-08
浅谈
webpack3.0+
快速了解前端打包 webpack
webpack用于编译JavaScript模块,是 JavaScript 静态模块的打包工具。从webpackv4.0.0开始,可以不用引入一个配置文件。1.入口(entry):指定webpack打包编译从哪个文件开始下手入口起点(entrypoint)指示webpack使用哪个模块,作为构建其内部...
代码星球
·
2020-04-08
快速
了解
前端
打包
webpack
Webpack的使用指南-Webpack小结
参考文章:https://baijiahao.baidu.com/s?id=1594972657801970108&wfr=spider&for=pc使用Webpack有一段时间了,但是感觉之前学的用的都比较零散,所以在这里整理一下Webpack的使用知识,从入门到进阶。创建项目首先创建最简单的一个项目...
代码星球
·
2020-04-08
Webpack
使用指南
-Webpack
小结
首页
上一页
...
13
14
15
16
17
...
下一页
尾页
按字母分类:
A
B
C
D
E
F
G
H
I
J
K
L
M
N
O
P
Q
R
S
T
U
V
W
X
Y
Z
其他