前言在前面的篇章中，已经说明了 webpack4 的基本使用，那么本章节开始在 webpack4 中构建vu
原创
2021-06-18 13:19:58
660阅读
前言在前面的篇章中，已经说明了 webpack4 的基本使用，那么本章节开始在 webpack4 中构建vue项目，同时对比看看这种构建方式，与在网页script导入 vue.js 中的区别。构建webpack项目开发首先重新构建webpack项目。初始化项目文件结构image-20
原创
2022-07-04 22:04:18
674阅读
转载
2017-04-05 09:51:00
135阅读
2评论
前端领域框架百花齐放，各种优秀框架出现（react，Vue，ag）等等框架。为了方便开发者快速开发， 开发对应的 cli 脚手架，来提高产出。然而初中级的前端工程师对项目里的 webpack 封装和配置了解的不清楚，就容易导致出问题不知如何解决，甚至不会通过 webpack 去扩展新功能，对 web ...
转载
2021-07-13 14:57:00
275阅读
2评论
前言最近有人给我的 Vue2 后台管理系统解决方案 提了 issue ，说执行 npm run build 构建项目的时候极其慢，然后就引起我的注意了。在项目中，引...
转载
2017-04-05 17:05:00
178阅读
2评论
前言要想使用Vue必须先创建Vue的实例, 创建Vue的实例通过new来创建, 所以说明Vue是一个类, 所以我们要想使用自己的
原创
2023-10-25 09:14:02
60阅读
前言 要想使用Vue必须先创建Vue的实例, 创建Vue的实例通过new来创建, 所以说明Vue是一个类, 所以我们要想使用自己的Vu
原创
2023-11-16 11:42:21
79阅读
webpack分为 七个大的组成部分 1.complier 2.compilation 3.chunk 4.parse 5.module 6.dependency 7.template 开始构建的时候compiler会调用run方法，compiler是webpack构建的入口，他可以拿到所有的环境配 ...
转载
2021-09-29 17:11:00
179阅读
2评论
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
108阅读
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
61阅读
一、webpack关键配置项对构建有所了解的，可直接略过本节此处不会深入介绍相关配置，更多的详细说明与配置参见官方文档，稍作介绍关键配置项铺垫后面内容。entrywebpack查找依赖的入口文件配置，入口文件可以有多个。单页面应用入口配置通常做法配置：vendor.js第三方依赖库，polyfill.js特性填充库，index.js单页面应用入口文件//导出配置module.exports={en
转载
2020-09-29 22:22:51
611阅读
前言:为什么要用webpack搭建项目呢,因为这个工具可以把目前浏览器不全部支持的ES6语法,通过打包工具(Babel插件)生成所有浏览器都支持的单个JS文件. 参考: https://blog.csdn.net/u012863664/article/details/72813941 使用vue2.
转载
2018-07-27 12:05:00
158阅读
2评论
一步一步尝试，下面这个是不支持的：首先：1.npm i vue -S把vue的包安装到项目运行依赖然后在npm run dev先放代码，再上效果图
原创
2022-09-13 12:30:09
101阅读
一个典型的项目结构Vue SPA Project Structure项目结构说明main.js 声明 Vue 项目的依赖。 声明 Vue 项目的入口（ DOM 挂载点）。 Vue 插件的基本设置。 router.js 配置路由规则 关于 CSS 的一些说明 业务型 CSS：单独写成 CSS 文件，并放在 styles 目录内。 局部 CSS：写在组件模板内，在 �<style>标签上加上scoped以锁定作用域。如果需要用到全局 CSS，使用...
原创
2020-08-10 17:38:44
289阅读
一个典型的项目结构Vue SPA Project Structure项目结构说明main.js 声明 Vue 项目的依赖。 声明 Vue 项目的入口（ DOM 挂载点）。 Vue 插件的基本设置。 router.js 配置路由规则 关于 CSS 的一些说明 业务型 CSS：单独写成 CSS 文件，并放在 styles 目录内。 局部 CSS：写在组件模板内，在 �<style>标签上加上scoped以锁定作用域。如果需要用到全局 CSS，使用...
原创
2020-08-10 17:38:44
171阅读
学习地址：慕课网：Vue+webpackgithub地址：todo源码教程中老师所用的webpack是3.0,直接使用最新版的构建时有些许不同，特此记录，以免遗忘。webpack：使用其作为构建工具，将静态资源（js，css，图片，字体...）打包，使之能够在html中正常运行 =>能够减少http请求1. 目录结构如下图，首先创建src文件夹存放静态资源，dist是打包之...
原创
2021-11-30 16:08:12
106阅读
下面这样子会报错我们如下进行更改：配置第三方loader，使得webpack可以识别.vue文件，将其打包为js...
原创
2022-09-13 12:29:58
61阅读
摘要：本文将介绍如何使用Vue2和Webpack构建一个现代化的前端项目。我们将从搭建开发环境开始，一步一步地介绍Vue2和Webpack的基本概念，以及它们的特点和应用场景。通过本文的学习，读者将能够掌握如何使用Vue2和Webpack构建高效、可维护的前端应用。一、介绍在当今的前端开发中，Vue.js和Webpack都是非常热门的工具。Vue.js是一款轻量级的JavaScript框架，专注于
原创
2023-07-03 15:07:28
589阅读
webpack 文档提供了一些优化构建性能的建议 —— webpack - 构建性能，对于一些小型项目来说，这些建议很有用！优化模块解析规则rule.include 和 rule.exclude在使用 loader 的时候通过include或者exclude属性传入必要的路径和文件，避免全局匹配，可以提升 webpack 构建的速度。例如babel-loader忽略node_modules内部的模
转载
2021-01-19 21:51:49
1784阅读
2评论
如何输出Webpack构建分析输出Webpack构建信息的 .json文件：webpack --profile --json > starts.json说明：--profile：记录构建中的耗时信息。--json：以json格式输出构建结果，最后只输出一个json文件（包含所有的构建信息）。web可视化查看构建分析得到了webpack构建信息文件 starts.json，如何进行很好的可视化
原创
2021-05-23 18:22:10
260阅读
