目录常用配置完整配置使用vue-cli 3.x 脚手架创建的 vue 项目不再有 build文件夹，若需要进行相关配置，需在项目目录下新
原创
2022-07-12 16:15:22
297阅读
1、项目根目录初始化package.json: npm init2、下载css与style的loader配置webpack中的css解析npm install css-loader style-loader --save-dev3、下载babel，webpack配置es6语法npm install babel-core babel-loader babel-plugin-transform-
原创
2022-11-20 00:41:19
48阅读
//引入一个包 const path = require("path"); //引入html文件 const HTMLWebpackPlugin = require("html-webpack-plugin"); //引入clean插件 const {CleanWebpackPlugin} = re ...
转载
2021-06-15 22:33:51
234阅读
前言 如果我们想在webpack中使用vue，就需要在webpack中配置vue 配置vue 首先，我们需要在项目中安装vue，安装命令如下： npm install vue --save 安装完成后，我们在主入口main.js文件中导入vue并创建一个实例 import Vue from 'vue
原创
2021-07-13 11:05:34
240阅读
Vue2介绍 1.vue2.0 Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。 Vue 的核心库只关注视图层 采用单文件组件 复杂大型单页应用程序（SPA） 响应式的数据绑定，与组件化的开发 HTML中的DOM与其他的部分独立开来划分出一个层次，这个层次就叫做
转载
2018-11-02 21:11:00
78阅读
2评论
1.1 什么是Webpack？ 从本质上来讲，webpack是一个现代的JavaScript应用的静态模块打包工具。 前端模块化 在ES6之前，我们要想进行模块化开发，就必须借助于其他的工具，让我们可以进行模块化开发。 并且在通过模块化开发完成了项目后，还需要处理模块间的各种依赖，并且将其进行整合打 ...
转载
2021-10-28 19:56:00
238阅读
2评论
一、依赖安装首先考虑到一个vue项目需要用到的库有vue、element-ui、axios，先进行安装npm i vue element-plus axios安装完后会生成package-lock.json、package.json和node_modules，安装的版本如下： 然后要安装webpack及需要用到的loader -D为安装开发依赖，只用于开发环境，安装完后会被写入package.js
目录一、npm二、webpack使用三、常见loader3.1 postCSS-loader3.2 file-loader3.3 uri-loader3.4 asset module type四、插件4.1 cleanWebpackPlugin插件4.2 htmlWebpackPlugin插件4.3 CopyWebpackPlugin插件五、其他配置 一、npmnode环境–>>np
本系列博客汇总在这里：Vue.js 汇总Webpack 详解一、认识 webpack1、什么是 webpack？2、前端模块化3、打包如何理解呢？4、和 grunt/gulp 的对比二、webpack 的安装1、查看自己的 node 版本2、全局安装 webpack3、局部安装 webpack（后续才需要）三、webpack 的起步1、准备工作2、js 文件的打包3、测试 ES6 的写法4、入口...
原创
2022-01-11 13:36:39
149阅读
转载
2017-12-21 13:07:00
147阅读
2评论
一. 在webpack中配置vue 了解了webpack的原理和用法以后, 我们来引入Vue webpack原理和用法详解链接: cnblogs.com/ITPower/p/14467745.html 第一步: 需要在webpack中引入vue.js 如何引入呢? npm install vue -
原创
2021-06-04 10:25:25
175阅读
本系列博客汇总在这里：Vue.js 汇总Webpack 详解一、认识 webpack1、什么是 webpack？2、前端模块化3、打包如何理解呢？4、和 grunt/gulp 的对比二、webpack 的安装1、查看自己的 node 版本2、全局安装 webpack3、局部安装 webpack（后续才需要）三、webpack 的起步1、准备工作2、js 文件的打包3、测试 ES6 的写法4
原创
2021-08-19 15:36:38
707阅读
一、介绍 vue的runtime-only版本和runtime-compiler版本： runtime-only版本：代码中不可以有任何的template runtime-compiler版本：代码中可以有template，此版本有编译template的代码 二、vue安装 1. 安装方式： 下载j ...
转载
2021-10-20 20:37:00
284阅读
2评论
前端工程化解决方案： 目前主流：webpack webpack vue、react都是基于webpack 隔行变色案例 新建空白文件夹，运行npm init -y指令 文件夹里新建src文件夹 ul>li{这是第$个li}*9 <!DOCTYPE html> <html lang="en"> <he ...
转载
2021-09-16 14:02:00
133阅读
2评论
前端工程化解决方案： 目前主流：webpack webpack vue、react都是基于webpack 隔行变色案例 新建空白文件夹，运行npm init -y指令 文件夹里新建src文件夹 ul>li{这是第$个li}*9 <!DOCTYPE html> <html lang="en"> <he ...
转载
2021-09-16 14:02:00
591阅读
2评论
npm install --save-dev sass-loader node-sassindex.html<!DOCTYPE html><html> <head> <meta charset=" </body></.
原创
2022-08-19 11:45:14
210阅读
Webpack 在执行的时候，除了在命令行传入参数，还可以通过指定的配置文件来执行。默认情况下，会搜索当前目录的 webpack.config.js 文件，这
Loaders cnpm install vue-loader@14 vue-template-compiler --save-dev webpack.config.js module: { rules: [{ test: /\.vue$/, use: ['vue-loader'] }], }, A
转载
2021-07-07 16:44:00
87阅读
Loaders cnpm install vue --save webpack.config.js resolve: { // 解决运行时报错 alias: { 'vue$': 'vue/dist/vue.esm.js' } } 使用 import Vue from "vue";
转载
2021-07-07 14:36:00
55阅读
optimization:{
splitChunks:{
chunks:'all', //以下这些默认值不用写
minSize:30*1024 ,//分割的chunk最小为30kb
maxSize:0,//最大没限制,
minChunks: 1 , //要提取的chunk最受被引用1次,
maxAsyncRequest
转载
2021-04-29 09:44:15
125阅读
2评论
