Description
Is your feature request related to a problem? Please describe.
I use vite to make a wordpress theme and use @vue/apollo-composable to get my article data. I followed the usage in the documentation to successfully get the list of articles.
Describe the solution you'd like
When I compiled using pnpm build
, I found that the packaged JavaScript
was as high as 232.82 kB │ gzip: 74.01 kB
, of which gzip
compressed a small part. According to the size limit report 📦
of apollographql/apollo-client
, less than 50KB. But my import { ApolloClient, createHttpLink, InMemoryCache } from '@apollo/client/core'` has 145KB.
Describe alternatives you've considered
I see that it imports dist/index.js
, and I use dist/index.js
to find that it is wrong.
Additional context
Add any other context or screenshots about the feature request here.
//app.js
import { createApp, h, provide } from 'vue'
import App from './app.vue'
import { ApolloClient, createHttpLink, InMemoryCache } from '@apollo/client/core'
import { DefaultApolloClient } from '@vue/apollo-composable'
<script>
import { useQuery } from '@vue/apollo-composable'
import gql from 'graphql-tag';
import { computed } from 'vue';
...
</script>
import { defineConfig } from 'vite'
import liveReload from 'vite-plugin-live-reload'
const { resolve } = require('path')
import vue from '@vitejs/plugin-vue';
export default defineConfig({
// config
root: '',
base: process.env.NODE_ENV === 'development'
? '/'
: '/wp-content/themes/funny/assets/',
build: {
// output dir for production build
outDir: resolve(__dirname, './assets'),
emptyOutDir: true,
assetsDir: '',
manifest: true,
target: 'es2018',
rollupOptions: {
input: {
app: resolve(__dirname + '/app.js'),
vue: resolve(__dirname + '/src/main.js')
},
},
},
plugins: [
vue(),
liveReload(
__dirname + '/**/*.php',
__dirname + '/**/**/*.{vue,js,ts,jsx,tsx}',
)
],
//
optimizeDeps: {
include: ['vue', 'vue-router'],
},
})