Comments (16)
I think that setting https://vitejs.dev/config/build-options.html#build-target to es2015
would fix the issue here.
Another option is using https://github.com/vitejs/vite/tree/main/packages/plugin-legacy as suggested in https://vitejs.dev/guide/build.html#browser-compatibility.
from front-end.
Hello @EchedeyLR, thanks for opening an issue, we don't support those browsers for now as I didn't have any clues about them. I'll be happy to try and support them.
Would you mind trying to get the changes you specified working with the browser you'd like to see supported?
Have a great day.
from front-end.
from front-end.
I tested on Pale Moon with a custom Photon-based theme (to avoid you confusing it with Firefox or similar).
I had to add a package.json since you avoid it to just use npx
.
I added testing over serve
which is a non-needed dependency and is just to run it on top of NodeJS.
from front-end.
vite.config.js:
import legacy from '@vitejs/plugin-legacy'
export default {
root: './src',
publicDir: '../assets',
build: {
outDir: '../dist'
},
plugins: [
legacy({
targets: ['defaults', 'not IE 11'],
}),
]
}
package.json:
{
"name": "front-end",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview",
"deploy": "serve ./dist/"
},
"devDependencies": {
"@vitejs/plugin-legacy": "^2.3.1",
"terser": "^5.16.1",
"vite": "^3.2.3"
},
"dependencies": {
"serve": "^14.1.2"
}
}
from front-end.
Thanks for your messages, I think you should fork the repo and create a branch, it would be easier to see your code in context.
A few comments on what you tried till now:
- We don't want to add a
package.json
if not necessary (maybe using thebuildTarget
option that you previously mentioned could work instead of adding a plugin?). - I don't understand the usage of
serve
when you have apreview
command from vite - Did you succeed in supporting your browser with your current configuration?
from front-end.
maybe using the buildTarget option that you previously mentioned could work instead of adding a plugin?
es2015 is ES6 which is supports modules. I can test but I am unsure if that would work.
Main point of using Vite on development use to be wide compatibility too, so I don't guess the focus on ignoring some tools even if I understand your minimalistic maintenance approach.
Development mode doesn't show it working in the browser since the Polyfills seems to only be loaded after a full compilation (building and then manual deployment).
I don't understand the usage of serve when you have a preview command from vite
serve
just make the deployment over ./dist/
folder as showed so I don't have to install Apache HTTP Server to show it working properly and, as told before, is something I added and not a requirement.
Did you succeed in supporting your browser with your current configuration?
As showed in the picture and described... yes...
from front-end.
I performed a test, both in development mode and deploy mode with serve
using build.target
at es2015
which is the minimum supported version by default: it didn't work.
from front-end.
Mmmm, I misread the use of vite preview
. Ok, I will test now.
from front-end.
The only way to support it is using the official legacy plugin as suggested before.
from front-end.
I am submitting changes to https://github.com/EchedeyLR/front-end/tree/extended-browser-support if you wanna review.
from front-end.
Thanks @EchedeyLR, I'll checkout your branch.
I'm just trying to keep the bloat to a minimum here, that is why looking for a solution without using any plugin would have been better But if there is none we will gladly add a package to handle it.
When you are ready with your changes do not hesitate to create a pull request so I can review it correctly before merging.
Have a great day.
from front-end.
I have a question related to project name and version in the package.json
file. If you check my branch, I just left them a bit general...
This applies a bit for the README.md
for which I am unsure if that name is currently appropriate.
I also have doubts if MWMBL must be in uppercase, lowercase, mixed or what since the search front-end shows it in both uppercase and lowercase...
from front-end.
@EchedeyLR In the package.json
you can omit the version number and the name and just put the package in private. We don't version this repo as of now (maybe we should but this is not the topic of this change).
The name in a sentence is written in lowercase as any word, in the logotype it is stylized in uppercase. In the end no change is needed in this regard.
I've checked your branch but you should really open a PR so I can do a proper review.
from front-end.
@ColinEspinas check #30
from front-end.
I think that github-pages CI could need some edition after this.
from front-end.
Related Issues (12)
- Initial phase: tracking issue
- Disable source maps in production build
- Remove google dependencies HOT 2
- Race condition when typing in search bar
- Respect reduced motion settings HOT 1
- Intermediary queries in browser history HOT 2
- Advanced search features
- Load Results In Limit & A Button To Show The Next Results! HOT 2
- refactor:
- Optimize CSS resources HOT 1
- Use atomic design to organize components HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from front-end.