yihanzhi的博客

1、npm安装本地包1）安装本地包的方式：npm install 待安装包的相对路径2）安装示例现有一项目，其根目录下有一个私有npm包（“my-test-npm”），需将该私有包添加为项目依赖包。现有项目根目录结构，如下图所示添加依赖执行命令（npm install ./my-test-npm），如下图所示：package.json文件依赖包添加成功后，package.json中可见该依赖包信息2、npm卸载本地包npm uninstall 待卸载包的相对路径...

查看vue cli3项目的webpack配置信息npx vue-cli-service inspect --mode [production|development]导出vue cli3项目的webpack配置信息到文件npx vue-cli-service inspect --mode [production|development] >> fileName

一、问题描述采用history模式的vue的单页面应用，刷新时404。问题分析：vue-router设置的路径不是真实存在的路径，故页面刷新后访问的资源在服务端找不到二、解决办法1、本地调试时，解决404的办法webpack配置文件修改：module.exports = { //... devServer: { historyApiFallback: true, // 自动将404响应跳转到首页入口文件 index.html }};在devServer里面有个hist

1）安装插件：‘babel-plugin-dynamic-import-node’npm install babel-plugin-dynamic-import-node -D2）修改配置文件：babel.config.jsmodule.exports = { env: { development: { plugins: ['dynamic-import-node'] } }}

一、应用场景：多个项目需要用到共同的组件，这时用多页面vue应用再适合不过了。但是这多个项目需要分别部署在不同服务器上，所以需要我们针对每个项目（即每个页面）进行单独打包。二、单独打包某个页面：这里我们以单独打包vue多页面应用中的其中一个页面（detail.html）为示例进行说明。1）创建新的打包模式：新建文件".env.detail"# set ENVNODE_ENV = 'production'# 需要打包的页面PAGE_NAME = 'detail'2）配置打包指令：修改pac

需求背景：在构建vue单页面项目时，会将所有依赖打包成一个文件，如果依赖文件过大，会影响页面渲染。为了好的用户体验我们需要对依赖文件进行拆分，那么如何拆分呢？解决方案：修改webpack的配置文件externals，从输出的依赖文件中排除某些依赖包，将被排除的依赖包单独引入到html页面中。示例：1）webpack配置文件修改externals: { 'vue': 'Vue', 'element-ui': 'ElementUI',}2）去除main.js中element-ui的引

1、安装自动补全css3前缀的插件：autoprefixernpm install -D autoprefixer2、修改package.json文件// package.json文件部分代码"browserslist": [ "> 1%", "last 2 versions", "ie > 8"]3、添加.postcssrc.js文件//.postcssrc.jsmodule.exports = { plugins: { autoprefixer:

1、安装分析工具：npm intall webpack-bundle-analyzer -D2、webpack.prod.config.js 中添加如下代码if (config.build.bundleAnalyzerReport) { const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnaly...