Closed Valgri closed 8 months ago
Hi @Valgri! 👋
It looks like you provided an invalid or unsupported reproduction URL. Do not use any service other than Codepen, jsFiddle, StackBlitz, Codesandbox, and GitHub. Make sure the URL you provided is correct and reachable. You can test it by visiting it in a private tab, another device, etc. Please edit your original post above and provide a valid reproduction URL as explained.
Without a proper reproduction, your issue will have to get closed.
Thank you for your collaboration. 👏
What happened?
Server crashes on renderSlot function with Cannot read property 'isCE' of null error.
Based on this comment https://github.com/vuejs/core/issues/4344#issuecomment-899064501 I tried removing the vue dependency from vue-slider-component
My package-json
{ "name": "myapp", "version": "0.0.1", "description": "", "productName": "myapp", "author": "", "private": true, "scripts": { "lint": "eslint --fix --ext .js,.vue src", "test": "TZ=UTC jest --notify -i --no-cache --coverage=\"true\"", "test:ci": "TZ=UTC jest -i --ci --reporters=default --reporters=jest-junit", "test:debug": "node --inspect-brk ./node_modules/jest/bin/jest.js --runInBand --watch", "dev:ssr": "yarn && env-cmd -f ./.env.dev quasar dev -m ssr", "dev:spa": "yarn && env-cmd -f ./.env.dev quasar dev", "dev:android": "yarn && quasar dev -m cordova -T android -- --buildConfig=\"../build.cordova.json\"", "dev:ios": "yarn && quasar dev -m cordova -T ios -- --buildConfig=\"../build.cordova.json\"", "dev:electron": "yarn && quasar dev -m cordova -T electron -- --buildConfig=\"../build.cordova.json\"", }, "dependencies": { "@babel/plugin-proposal-nullish-coalescing-operator": "^7.18.6", "@quasar/extras": "^1.16.4", "@rollup/plugin-babel": "^6.0.4", "@stripe/stripe-js": "1.48.0", "@vee-validate/rules": "^4.8.4", "axios": "^1.2.1", "body-scroll-lock": "^3.1.5", "browserslist-useragent": "4.0.0", "chart.js": "^3.8.2", "copy-to-clipboard": "^3.3.3", "cross-env": "7.0.3", "date-fns": "2.29.3", "date-fns-tz": "2.0.0", "date-time-format-timezone": "1.0.22", "daterange-picker-for-vue-3": "^0.0.2", "dotenv": "^16.3.1", "env-cmd": "^10.1.0", "file-saver": "2.0.5", "html-entities": "1.3.1", "intersection-observer": "0.12.2", "jsvat": "^2.5.3", "lodash-es": "^4.17.21", "mapbox-gl": "1.12.0", "md5": "^2.3.0", "process": "^0.11.10", "quasar": "^2.6.0", "showdown": "^2.1.0", "shrink-ray-current": "4.1.3", "superstruct": "0.8.3", "vee-validate": "4.8.1", "vite-plugin-stylelint": "^5.2.0", "vue": "^3.4.15", "vue-error-boundary": "2.0.1", "vue-i18n": "^9.0.0", "vue-popperjs": "^2.3.0", "vue-router": "^4.0.0", "vue-slider-component": "^4.1.0-beta.7", "vue-social-sharing": "4.0.0-alpha4", "vue3-popper": "^1.5.0", "vuex": "^4.0.1", "vuex-persistedstate": "4.1.0", "wallaby-vue-compiler": "^1.0.6" }, "devDependencies": { "@babel/eslint-parser": "^7.0.0", "@babel/plugin-proposal-nullish-coalescing-operator": "^7.18.6", "@babel/plugin-proposal-optional-chaining": "7.21.0", "@babel/plugin-transform-modules-commonjs": "^7.23.0", "@babel/plugin-transform-runtime": "^7.23.9", "@babel/preset-env": "^7.23.8", "@intlify/vite-plugin-vue-i18n": "^3.3.1", "@intlify/vue-i18n-loader": "^4.2.0", "@quasar/app-vite": "^1.3.0", "@quasar/babel-preset-app": "^2.0.2", "@vue/compiler-sfc": "3.3.2", "@vue/eslint-config-airbnb": "4.0.0", "@vue/test-utils": "^2.0.0-rc.18", "@vue/vue3-jest": "^29.2.4", "autoprefixer": "^10.4.2", "babel-core": "^7.0.0-bridge.0", "babel-jest": "29.5.0", "babel-plugin-lodash": "3.3.4", "babel-plugin-transform-import-meta": "^2.2.1", "babel-polyfill": "6.26.0", "browserslist-useragent-regexp": "4.0.0", "core-js": "3.32.0", "dotenv": "^16.0.3", "eslint": "^8.10.0", "eslint-config-airbnb-base": "^15.0.0", "eslint-config-standard": "^16.0.2", "eslint-plugin-import": "^2.20.1", "eslint-plugin-no-cyrillic-string": "1.0.5", "eslint-plugin-node": "^11.0.0", "eslint-plugin-promise": "^5.1.0", "eslint-plugin-quasar": "^1.0.0", "eslint-plugin-vue": "^9.0.0", "figma-js": "1.16.0", "find-in-files": "0.5.0", "husky": "3.0.9", "hygen": "6.2.11", "identity-obj-proxy": "3.0.0", "jest": "^29.5.0", "jest-environment-jsdom": "^29.5.0", "jest-junit": "^16.0.0", "jest-serializer-vue": "3.1.0", "jest-watch-typeahead": "^2.2.2", "lint-staged": "^13.1.2", "node-notifier": "^10.0.1", "pm2": "4.4.0", "postcss": "8.2.15", "postcss-html": "^1.6.0", "postcss-import": "^16.0.0", "prettier-stylelint": "0.4.2", "rimraf": "4.3.1", "stylelint": "^15.11.0", "stylelint-config-html": "^1.1.0", "stylelint-config-recommended-vue": "^1.5.0", "stylelint-config-standard": "^36.0.0", "stylelint-config-standard-scss": "^11.1.0", "stylelint-declaration-block-no-ignored-properties": "2.7.0", "stylelint-declaration-use-variable": "1.7.3", "stylelint-high-performance-animation": "1.8.0", "stylelint-order": "6.0.3", "stylelint-scss": "4.4.0", "svgo": "3.0.2", "vue-styleguidist": "^4.58.0", "vue-template-compiler": "2.7.14" }, "engines": { "node": "^18 || ^16 || ^14.19", "npm": ">= 6.13.4", "yarn": ">= 1.21.1" }, "husky": { "hooks": { "pre-commit": "lint-staged" } }, "lint-staged": { "./src//*.+(js|vue)": [ "jest --findRelatedTests --coverage=\"false\"", "git add" ], "./src/*/.+(vue|scss)": [ "yarn stylelint", "git add" ], "./src//*.+(vue)": [ "yarn collect-keys", "yarn translate-local", "git add" ], "*/.+(js|vue)": [ "yarn lint", "git add" ] } }
What did you expect to happen?
No error, and my library is rendered with a slot
Reproduction URL
/
How to reproduce?
my quasar.config.js
/ eslint-env node /
/*
// Configuration for your app // https://v2.quasar.dev/quasar-cli-vite/quasar-config-js const md5 = require('md5'); const { join, resolve } = require('path'); const fs = require('fs'); const { configure } = require('quasar/wrappers'); // helper to get a better IDE autocomplete experience (through Typescript) const { getBabelOutputPlugin } = require('@rollup/plugin-babel'); require('dotenv').config();
/ eslint func-names: 0 / / eslint global-require: 0 /
const hash = md5(Date.now());
module.exports = configure((ctx) => ({ eslint: { fix: true, // include: [], // exclude: [], // rawOptions: {}, warnings: false, errors: false, },
// https://v2.quasar.dev/quasar-cli-vite/prefetch-feature preFetch: true,
// app boot file (/src/boot) // --> boot files are part of "main.js" // https://v2.quasar.dev/quasar-cli-vite/boot-files boot: [ // { path: 'env', client: false }, 'env', 'ua-polyfills', 'extend-lib-components', // { path: 'ssr-translations', client: false }, 'global', 'user-storage', 'i18n', 'translation', 'interceptors-api', 'shopify-redirect', { path: 'goto', client: false }, 'router', 'vee-validate', { path: 'persist-state-client', server: false }, 'source-data', 'static-data', 'growthbook', ],
// https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#css css: ['app.scss'],
// https://github.com/quasarframework/quasar/tree/dev/extras extras: [ // 'ionicons-v4', // 'mdi-v5', // 'fontawesome-v6', // 'eva-icons', // 'themify', // 'line-awesome', // 'roboto-font-latin-ext', // this or either 'roboto-font', NEVER both!
],
// Full list of options: https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#devServer devServer: { // https: true open: false, // opens browser window automatically port: ctx.mode.spa ? 8080 : 9000, proxy: { '/cms': { target: 'http://test-api.myapp.online', changeOrigin: true, }, '/img': { target: 'http://test-api.myapp.online', changeOrigin: true, }, '/downloads': { target: 'http://test-api.myapp.online', changeOrigin: true, }, '/static_data': { target: ctx.dev ? 'http://localhost:8000/' : process.env.DOMAIN_NAME, changeOrigin: true, secure: !ctx.dev, configure: (proxy) => { proxy.on('proxyReq', (proxyReq, req, res) => { const file = req.url.split('/').pop(); res.setHeader('Content-Type', 'application/json'); const data = fs.readFileSync(
./src/statics/static_data/${file}
); res.end(data); }); }, }, '/static_translations': { target: ctx.dev ? 'http://localhost:8000/' : process.env.DOMAIN_NAME, changeOrigin: true, secure: !ctx.dev, configure: (proxy) => { proxy.on('proxyReq', (proxyRes, req, res) => { const file = req.url.split('/').pop(); res.setHeader('Content-Type', 'application/json'); const data = fs.readFileSync(./src/statics/static_data/${file}
); res.end(data); }); }, }, }, },// Full list of options: https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#build build: { target: ['esnext'], scopeHoisting: true, gzip: true, extendViteConf: (config) => { config.resolve = { dedupe: ['vue'], alias: { vue: resolve('./node-modules/@vitejs/plugin-vue'), }, }; config.css = { preprocessorOptions: { scss: { additionalData: '@import "src/css/global/_mixins.scss"; @import "src/css/global/_variables.scss";', }, }, }; }, afterBuild: () => { const pathToSPA = './dist/spa'; // added to insert "FE_FULL_DOMAIN" instead of / in index.html file ( ...<base href=/ ... ) // needed for prerender deploys fs.readFile(
${pathToSPA}/index.html
, 'utf-8', (err, mainHtml) => { if (err) { console.warn(err); } else { const envVar = 'FE_FULL_DOMAIN'; const newHtml = mainHtml.replace( /((.|\n))(base href=\/)((.|\n))/, // split html file over 'base href=/'$1base href="${envVar}"$4
, // $1 - before searched text, $4 - everything after it ); // make sure we just changed / to "FE_FULL_DOMAIN" in base.href // we should substract envVar.length + 2 (quots) - 1 ( / was initially ) if (mainHtml.length === newHtml.length - envVar.length - 1) { fs.writeFileSync(${pathToSPA}/index.html
, newHtml); console.log(${envVar} has been added to ${pathToSPA}/index.html
); } else { console.warn(${envVar} was not added to ${pathToSPA}/index.html
); } } });},
// https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#framework framework: { config: { loadingBar: { color: 'primary', // hint: if changed here - should be also changed in index.html styles }, }, cssAddon: false, // iconSet: 'material-icons', // Quasar icon set // lang: 'en-US', // Quasar language pack
},
// animations: 'all', // --- includes all animations // https://v2.quasar.dev/options/animations animations: ['headShake', 'slideInDown', 'pulse'],
// https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#property-sourcefiles // sourceFiles: { // rootComponent: 'src/App.vue', // router: 'src/router/index', // store: 'src/store/index', // registerServiceWorker: 'src-pwa/register-service-worker', // serviceWorker: 'src-pwa/custom-service-worker', // pwaManifestFile: 'src-pwa/manifest.json', // electronMain: 'src-electron/electron-main', // electronPreload: 'src-electron/electron-preload' // },
// https://v2.quasar.dev/quasar-cli-vite/developing-ssr/configuring-ssr ssr: { // ssrPwaHtmlFilename: 'offline.html', // do NOT use index.html as name! // will mess up SSR
},
// https://v2.quasar.dev/quasar-cli-vite/developing-pwa/configuring-pwa pwa: { // workboxMode: 'generateSW', // or 'injectManifest' // injectPwaMetaTags: true, // swFilename: 'sw.js', // manifestFilename: 'manifest.json', // useCredentialsForManifestTag: false, // useFilenameHashes: true, // extendGenerateSWOptions (cfg) {} // extendInjectManifestOptions (cfg) {}, extendManifestJson(json) { return { ...json, name: 'myapp', short_name: 'myapp', display: 'standalone', background_color: '#ffffff', theme_color: '#ffffff', icons: [ { src: 'icons/android-chrome-192x192.png', sizes: '192x192', type: 'image/png', }, { src: 'icons/android-chrome-512x512.png', sizes: '512x512', type: 'image/png', }, ], }; }, // extendPWACustomSWConf (esbuildConf) {} },
// Full list of options: https://v2.quasar.dev/quasar-cli-vite/developing-cordova-apps/configuring-cordova cordova: { // noIosLegacyBuildFlag: true, // uncomment only if you know what you are doing },
// Full list of options: https://v2.quasar.dev/quasar-cli-vite/developing-capacitor-apps/configuring-capacitor capacitor: { hideSplashscreen: true, },
// Full list of options: https://v2.quasar.dev/quasar-cli-vite/developing-electron-apps/configuring-electron electron: { // extendElectronMainConf (esbuildConf) // extendElectronPreloadConf (esbuildConf)
},
// Full list of options: https://v2.quasar.dev/quasar-cli-vite/developing-browser-extensions/configuring-bex bex: { contentScripts: [ 'my-content-script', ],
}, }));
I had trying solution from https://github.com/vuejs/core/issues/4344 But after I have added dedupe: ['vue]
I have got a new warning - Internal server error: Failed to resolve import "src/css/app.scss" and for other import ex. - boot folder
Flavour
Quasar CLI with Vite (@quasar/cli | @quasar/app-vite)
Areas
Quasar CLI Commands/Configuration (@quasar/cli | @quasar/app-webpack | @quasar/app-vite)
Platforms/Browsers
Chrome
Quasar info output
No response
Relevant log output
No response
Additional context
No response