搜索结果
查询Tags标签： webpack，共有 749条记录-
webpack5 eslint的配置采用 airbnb风格
下载相关包npm i eslint eslint-config-airbnb-base eslint-plugin-import -D并在 package.json中配置添加"eslintConfig": {"extends": "airbnb-base"}在webpack中配置 eslintnpm i eslint-webpack-plugin -D引入const EslintPlugin = req…
2022/4/18 23:43:08 人评论 次浏览 -
浅析loader和plugin的本质、如何编写自定义的同步和异步的Loader、如何编写自定义的plugin及整个编译生命周期钩子
一、编写 Loader 和 Plugin 介绍及模板 1、Loader 本质及编写 Loader在编写 Loader 前，我们首先需要了解 Loader 的本质。其本质为函数，函数中的 this 作为上下文会被 webpack 填充，因此我们不能将 Loader 设为一个箭头函数。函数接受一个参数，为webpack传递给Loader的…
2022/4/16 23:14:04 人评论 次浏览 -
WebPack基本使用
入口和出口文件： 在我们打包一个项目的时候，他们都有默认的出口和入口文件，入口(./src/index.js) 出口(./dist)，那么我如果我的项目，入口比如是./src/main.js，出口是./build，该去如何指定呢？ 1.在命令的后面加选项 如：npx webpack --entry ./src/main.js --outpu…
2022/4/10 6:15:46 人评论 次浏览 -
ES6之Module模块与Babel编译
一、Module模块 示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分析任务而创建的。 1.Module是什么 2.Module的基本用法 3.export default和对应的import 二、Babel与webpack 1.Babel是什么 2.Babel的使用方式 3.使用Babel前的准备工作 4.使用Babel编译ES6代…
2022/3/21 6:31:00 人评论 次浏览 -
使用webpack，编译前端ts项目
步骤：下载安装webpack "webpack"，"webpack-cli"npm install webpack webpack-cli --save-dev下载ts-loader和html-webpack-plugin插件，供webpack编译使用创建webpack.config.js文件，内容如下:// @ts-ignore const HtmlWebpackPlugin = require(ht…
2022/3/19 6:28:24 人评论 次浏览 -
webpack.config.js
const path = require(path);module.exports = {entry: {index: ./src/index.ts, // 输入},mode: development, // 开发module: {rules: [{test: /\.ts$/, // 处理.ts文件use: ts-loader, // 使用 ts-loader打包编译ts文件exclude: /node_modules/, // 不处理node_modules…
2022/3/6 6:16:43 人评论 次浏览 -
创建Vue2项目
1.安装Node.js * Node.js中包含了npm工具 安装后查看版本：node -v npm -v 2.设置npm的源为国内源npm config set registry https://registry.npm.taobao.org 3.安装webpacknpm install -g webpack 4.安装脚手架npm install -g vue-cli 5.创建项目 假设项目名是clotho…
2022/3/6 6:16:40 人评论 次浏览 -
webpack运行报错
当下版本（并不匹配）： 后续安装一系列包… package.json中进行相关配置： 报错： npm ls --depth 0可见包版本不匹配： 查询相关资料，卸载项目相关不匹配版本包后安装匹配包版本： 此时报如下错： 更换vue-loader版本： 此时报如下错： 根据提示换包版本： …
2022/3/2 23:47:36 人评论 次浏览 -
webpack学习使用
什么是Webpack WebPack可以看做是模块打包机：它做的事情是，分析你的项目结构，找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言（Scss，TypeScript等），并将其打包为合适的格式以供浏览器使用 如：vue项目是基于es6语法构建的，而大多数浏览器都是使用的…
2022/3/2 23:46:26 人评论 次浏览 -
webpack5配置问题
问题描述： 安装webpack-dev-server(4.7.4), 在package.json的scripts中增加"script":{"serve":"webpack serve" }运行起来后只显示public/index.html的模版页面，js文件并没加载进来。 查看了下输出 Content not from webpack is served…
2022/2/17 6:13:28 人评论 次浏览 -
webpack 安全和开发 配置建议
配置文件：webpack.config.js 修改位置module.exports = {}// mode 运行的模式，开发development和production生产 开发环境下：建议把devtiool的值设置eval-source-map好处：可以精准定位到具体的错误行号 module.exports = { devtool:eval-source-map …
2022/2/11 23:46:53 人评论 次浏览 -
vue、vue-cli、webpack安装
####vue安装 - npm i -g vue ####vue-cli - npm install -g vue-cli npm install --global vue-cli #### npm install -g webpack ####vue常用命令 - 创建项目 > vue init webpack 项目名称 -
2022/2/10 23:13:17 人评论 次浏览 -
【新手教程】2022vue-cil安装教程（详细）
2022保姆级教程从0到1安装npm、vue脚手架 1.安装node.js 前往官网 https://nodejs.org/en/download/在D盘中创建nodejs文件夹，将安装路径放在这。在文件夹中创建node_cache 和 node_global 分别保存node的缓存和node的全局变量2.配置node和npm的环境 前往 系统变量 -->…
2022/1/29 6:06:37 人评论 次浏览 -
【前端工程化】三：模块化开发之webpack4
模块化开发ESModules存在环境兼容问题 模块文件过多，网络请求频繁 所有的前端资源都需要模块化 需求，将所有ES6的代码编译成ES5或兼容性更好的代码，并且将转换后的代码打包成一个文件，并且支持不同类型的资源模块；前面两个需求可以使用前面学习的构建系统glup等，…
2022/1/13 23:03:56 人评论 次浏览 -
【前端工程化】三：模块化开发之webpack4
模块化开发ESModules存在环境兼容问题 模块文件过多，网络请求频繁 所有的前端资源都需要模块化 需求，将所有ES6的代码编译成ES5或兼容性更好的代码，并且将转换后的代码打包成一个文件，并且支持不同类型的资源模块；前面两个需求可以使用前面学习的构建系统glup等，…
2022/1/13 23:03:56 人评论 次浏览
