首页 > 其他分享 >vue-cli/webpack4.x 打包--打包文件输出

vue-cli/webpack4.x 打包--打包文件输出

时间:2023-01-17 15:25:29浏览次数:37  
标签:map vue cli -- js outputDir 打包

runtimeCompiler 

  ture: runtime-compiler    template开发
  false: runtime-only          jsx语法开发

publicPath

vue.config.js 中配置打包基路径
publicPath: process.env.VUE_APP_BASE_PATH

例如
  如需要在http://www.baidu.com下加一个子域http://www.baidu.com/map
  则需要配置 publicPath:'/map'

  同时需要在router.js中配置

const router = new VueRouter({
  base: '/map',
  ...
})

outputDir

项目打包生成的文件的存储目录,可以是静态路径也可以是相对路径。

outputDir: 'dist'  // 输出文件目录

assetsDir

 设置放置打包生成的静态资源 (js、css、img、fonts) 的目录。

 注意: 该目录是相对于 outputDir,打包后 dist / static。

assetsDir: 'static'  //静态资源路径

productionSourceMap

开发需要map 线上不需要 map--提供代码映射 方便于在浏览器控制台调试

productionSourceMap: process.env.NODE_ENV==='production' ? false : true,

 

 

 

 

 

 

 

标签:map,vue,cli,--,js,outputDir,打包
From: https://www.cnblogs.com/wxyblog/p/17057812.html

相关文章

  • vue-cli/webpack4.x 打包--webpack配置--devServer
    devServer.env.development 配置全局变量#代理配置VUE_APP_BASE_IP='http://192.128.15.157:15530'VUE_APP_BASE_API='/api'vue.config.js 中配置  devS......
  • vue脚手架—render函数
    一、关于不同版本Vue:1.vue.js和vue.runtime..js的区别:(1)vue.js是完整版的Vue,包含核心功能+模板解析器(2)vue.runtime..js是运行版的Vue,只包含核心功能,没有模板解析器......
  • vue-cli/webpack4.x 打包--兼容IE等低版本浏览器
    依赖版本  "babel-polyfill":"^6.26.0",  "core-js":"3.21.1",  "regenerator-runtime":"0.13.5",main.js引入vue.config.js配置 transpileDe......
  • vue项目引入svg图标(完整步骤)
    1.安装svg依赖在vue中首先需要安装可以加载svg的依赖。npm安装:npminstallsvg-sprite-loader--save-dev2.创建svg文件夹存放svg图标创建icons文件夹,在icons文件夹下......
  • 小满Vue3第四十六章(Proxy跨域)
    1.首先我们先了解一下什么是跨域主要是出于浏览器的同源策略限制,它是浏览器最核心也最基本的安全功能。当一个请求url的协议、域名、端口三者之间任意一个与当前页面url不......
  • 小满Vue3第四十五章(Vue3 Web Components)
    什么是 WebComponentsWebComponents提供了基于原生支持的、对视图层的封装能力,可以让单个组件相关的javaScript、css、html模板运行在以html标签为界限的局部环境中,不......
  • Vue3 响应式原理
     响应式原理Vue2使用的是 Object.defineProperty Vue3使用的是Proxy2.0的不足对象只能劫持设置好的数据,新增的数据需要Vue.Set(xxx) 数组只能操作七种方法,修改某......
  • 小满nestjs(第六章 nestjs cli 常用命令)nest --help 可以查看nestjs所有的命令
    nest--help可以查看nestjs所有的命令他的命令和angular很像 案例生成一个用户模块1.生成controller.tsnestgcouser2.生成  module.tsnestgmouser3.生成service.t......
  • 小满Vue3第三十八章(函数式编程,h函数)
    之前跟大家介绍了两种vue编写风格分别是template模板方式,和JSX方式感觉JSX被大家吐槽的很厉害,其实用习惯还挺好用的今天介绍第三种函数式编程主要会用到h函数​​h​​ 接......
  • Vue3 (Vscode插件)
    前端开发的编辑器有很多种如DW,hubilder,WebStorm,sublime,vscode,等等。​​Vue3+vite+Ts+pinia+实战+源码+全栈_哔哩哔哩_bilibili​​ 视频教程随着VsCode开......