vue创建多入口，多模板的项目

最新推荐文章于 2024-08-07 22:02:39 发布

寒墨茗殇

最新推荐文章于 2024-08-07 22:02:39 发布

阅读量447

点赞数

分类专栏： vue 文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/qq_40591925/article/details/125524211

版权

vue 专栏收录该内容

17 篇文章 1 订阅

订阅专栏

vue.config.js

module.exports = {
   assetsDir:"static",
  outputDir:"dist",
  indexPath:"index.html",
  pages: {
    main: {
      entry: 'src/main.js',
      template: 'public/index.html',
      filename: 'index.html',
      title: 'index',
      chunks: ['chunk-vendors', 'chunk-common', 'main']
    },
    iframeWin: {
      entry: 'src/iframeWin/main.js',
      template: 'public/iframeWin.html',
      filename: 'iframeWin.html',
      title: 'iframe_win',
      chunks: ['chunk-vendors', 'chunk-common', 'iframeWin']
    }
  },
  publicPath: './',
  chainWebpack: config => {
    config.resolve.alias
      .set('@', resolve('src'))
      .set('src', resolve('src'))
      .set('_iframe', resolve('src/iframe/common'))
 }
}

public目录：

新建一个iframeWin.html文件

iframeWin.html:

<!DOCTYPE html>
<html lang="cn">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width,initial-scale=1.0">
  <link rel="icon" href="./favicon.ico">
  <title>IframeWin</title>
</head>

<body>
  <div id="IframeWin"></div>
</body>

</html>

src目录下：

创建main.js和App.vue

main.js

import Vue from 'vue'
import App from './App.vue'
if (
  process.env.VUE_APP_WEB === 'pc' ||
  process.env.VUE_APP_WEB === 'mac_pc'
) {
  Vue.prototype.$electron = require('electron')
}
new Vue({
  render: h => h(App)
}).$mount('#IframeWin')