环境:vue的安装方式使用vue-cli命令行自动生成一个项目 已知知识:vue单文件将组件写在了一个.vue后缀的文件中,有三部分<template> <script> css样式,在该文件中使…
分类:webpack
记一次使用 vue-admin-template 的优化历程
本文原文 前言 公司有好几个项目都有后台管理系统,为了方便开发,所以选择了 vue 中比较火的 后台模板 作为基础模板进行开发。但是,开始用的时候,作者并没有对此进行优化,到项目上线的时候,才发现,打包出来的文件都十分之…
vue-cli脚手架中webpack配置基础文件详解
一、前言 vue-cli是构建vue单页应用的脚手架,输入一串指定的命令行从而自动生成vue.js+webpack的项目模板。这其中webpack发挥了很大的作用,它使得我们的代码模块化,引入一些插件帮我们完善功能可以将…
vue实现todo功能(一):搭建vue-webpack环境
前言 我最开始因为项目原因接触的是react,对于我这种美观狂而言,react中难以调解的css让我十分抓狂,说是在写页面,因为不能写自己的样式,像是在拼凑页面,没意思。于是我开始了解vue这种将css html jav…
我是如何在公司项目中使用ESLint来提升代码质量的
ESLint:你认识我吗 ESLint是一个语法规则和代码风格的检查工具。 和学习所有编程语言一样,想要入门ESLint,首先要去它的官网看看:https://eslint.org/。 ESLint的版本问题 目前ESL…
Webpack 中css 如何 import 使用 alias别名 相对路径
在开发过程中我们发现以下问题: JS可以用alias,css就报错 js中:import tool from ‘@/utils/xxx’ (可以引用)css中:@import ‘@/a…
借助webpack对项目进行分析优化
进入公司之后,接手的便是前人留下来的一个大项目。庆幸的是整个项目拥有完善的产品功能文档,但是由于项目过于庞大,老旧。包含了打包过慢,冗余文件过多等诸多问题。想要快速的解决这些问题,想要完全把功能重构一遍的话,成本太高了。…
从零开始的 webpack4 + vue2.x
新建文件夹 webpack-vue 安装依赖 yarn init //初始化package.json yarn add webpack webpack-cli //添加webpack、webpack-cli //ps:不…
nodejs插件之二
上一章记录了node的path模块,这一章我们接着讲一下node其他的插件。在这章中有许多插件都提到了如果没有TTY或者运行在CI中时插件不可用,对于TTY和CI这些名词我不是很明白,他们指的具体是什么东西呢?望知道的人…
写一个vue组件(todo-list)发布到npm上
前言 最近几个人合作完成了一个项目,发现有一些公用的基础业务组件,可以提取出来,不仅方便大家在各自模块直接引用,也可以在以后的项目中使用。想到了可不可以自己动手把组件打包发布到内部的npm上,避免以后小伙伴们的重复工作呢…
使用 Webpack 打造 vue - todo 应用实践( 五 )
最后做了一些优化,比如css分离出来、hash优化。 // 分离css的插件 npm inatall mini-css-extract-plugin --save // webpack.config.js const p…
使用 Webpack 打造 vue - todo 应用实践( 四)
之前进行了webpack的相关配置,现在我们lai 实现一下具体页面 重构了目录结构 -src - assets - images - background-image.jpg - done.svg - round.sv…