Comments (13)
@voidale it's planned to be added before the 1.0
from nuxt.js.
What do you think of an build.cdn
option?
publicPath should not be changed to another directory (because of how Nuxt.js static middleware works), but having a cdn
option makes it clear it has to be an URL.
Example of nuxt.config.js
:
module.exports = {
build: {
cdn: 'https://example.cnd.com/nuxt/'
}
}
I will also make the generation of the JS files to have a chunkName
(nuxt.bundle.986293.js) so on the CDN, there won't be any cache problems.
from nuxt.js.
Just as a reference, I think serverless
had a quite nice approach to move all files from specific folder to a S3 bucket:
https://github.com/serverless/examples/tree/master/aws-node-single-page-app-via-cloudfront
They used the aws-cli
internally and synced the folder to the destination bucket. I think it would be great to pick up this idea, because for leverage browser caching and setting expired headers it would be neat to store JS, CSS and images outside of the webserver location.
You guys doing a great job, haven't used it much yet but looking forward to use it in an upcoming project.
from nuxt.js.
Hi! I'm happy that your team like nuxt.js :)
To be sure, all files in your static folder will be on the CDN, but not the generated JS and CSS files from Nuxt.js right?
from nuxt.js.
No, I mean the files generated by Nuxt.js (webpack behind the scene), that is, the .nuxt/dist
folder. Just as the output.publicPath
config examples does. (https://webpack.js.org/configuration/output/#output-publicpath)
Maybe I will remove server-bundle.js
before putting the files on to CDN, as it doesn't need on client side.
from nuxt.js.
I think CDN and static middleware are mutually exclusive. If you set publicPath a value begin with /http(s):/
, then static middleware shouldn't on. Otherwise, middleware should serves files under that path, hard coded a /_nuxt/
path in URL is not so good. so I think we can reuse publicPath and determine by Regex, whether assets are hosted by self or on CDN.
from nuxt.js.
I added /_nuxt/
to avoid conflicts between the static
folder and the generated files of Nuxt.js.
I might be able to add build.publicPath
but if it's not an url, it can create problems with nuxt generate
for static web apps generation.
from nuxt.js.
@Atinux
Your proposed addition of CDN url is perfect with chunkName (nuxt.bundle.986293.js) and it's how should work been using this approach with Meteor it works great.
Could this be added? I'm currently editing it manually to the CDN
As for @fenivana for public assets that are located in /static/ you can manually or create a helper function to generate a full CDN url so instead of:
<img src="/logo.png" />
<img src="https://example.cloudfront.net/logo.png" />
from nuxt.js.
@Atinux I noticed you're setting nuxtStatic to false automatically https://github.com/nuxt/nuxt.js/blob/0.9.10/lib/build.js#L88-L91. I think this should be a manual thing otherwise service like cloudfront won't work. Cloudfront works by grabbing the files from the main url if they aren't cached yet. I.e. if you have https://mysite.cloudfront.net/static/favicon.ico and Cloudfront doesn't have that file, it will grab it from https://mysite.com/static/favicon.ico. So in that case nuxtStatic
will still need to be true.
from nuxt.js.
@Atinux If I also support http and https, I would begin with '//xxx.xxx.com' instead 'http://xxx.xxx.com' or 'https://xxx.xxx.com'.
from nuxt.js.
I updated the code to take care of it as well @rubyless
from nuxt.js.
The 0.10 release it out ✋
It took a while but it's now fully working!
from nuxt.js.
This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.
from nuxt.js.
Related Issues (20)
- https://nuxt.com isn't working on firefox HOT 2
- "No match found for location with path" is still spammed on unknown paths HOT 1
- Uncaught SyntaxError when building Nuxt.js 3.11.2 with Webpack HOT 1
- Docs: Nuxt Layers video update with latest one
- Docs: Nuxt Layers video update with latest one
- node .output/server/index.mjs error HOT 2
- Cannot find module from node_modules
- Move `@nuxt/ui-templates` into nuxt/nuxt monorepo
- Refreshed NuxtWelcome design (+ other error pages?)
- Resolve `runtimeConfig` within nuxt options
- public subfolder name collision with route causes 301 redirect HOT 1
- Unable to access logger in client or server from plugin HOT 1
- Error with `dist` symlink with SST Ion
- Navigating from router-view throws Missing required param
- Failed CSS preloads shouldn't throw errors
- Big bundle size due to jsdom canvas HOT 1
- 页面刷新 页面抖动
- ERROR (node:52837) [DEP0180] DeprecationWarning: fs.Stats constructor is deprecated HOT 1
- nuxt aos set options { once: true }, only show the animation on the first visit but not work when navigating to a page HOT 1
- static generating is removing invalid html, but not reporting when linting
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 nuxt.js.