`cdnPath` on the built seems to not work as expected.
wan2land opened this issue Β· comments
Hi @wan2land hope you're doing great, thanks for the work on this plugin! I'm writing because everything seems to be working fine, but the cdnPath
on the built seems to not work as expected.
The weird thing is that in the .nuxt/dist/server/server.js
for example the __webpack_public_path__
is properly set but when I navigate to the site (I'm using a custom domain) all the assets seems to be loaded from the /__nuxt/....
Do you have any idea where to look in order to fix this?
I have in the nuxt.config.js:
module.exports = {
telemetry: false,
mode: 'universal',
target: 'server',
srcDir: 'src/',
server: {
port: 4400,
},
head: {
...
},
build: {
// The "publicPath" value is automatically generated by the serverless-nuxt plug-in
// If the "publicPath" value is set, delete it.
},
buildModules: [
['@nuxtjs/google-analytics', { id: 'UA-XXX' }],
'@nuxtjs/google-fonts',
'@nuxtjs/tailwindcss',
],
}
and in the serverless.yml
service: service-name
frameworkVersion: '2'
plugins:
- serverless-nuxt-plugin
- serverless-s3-sync
- serverless-dotenv-plugin
- serverless-apigw-binary
- serverless-offline
- serverless-domain-manager
package:
individually: true
excludeDevDependencies: true
exclude:
- src/**
- .nuxt/**
- package.json
- package-lock.json
- .gitignore
- .env.example
- node_modules/**
- src/static/**
include:
- .nuxt/dist/**
provider:
name: aws
runtime: nodejs12.x
lambdaHashingVersion: 20201221
region: us-east-2
stage: ${env:STAGE}
versionFunctions: false
apiGateway:
shouldStartNameWithService: true
environment:
NODE_ENV: ${env:NODE_ENV}
custom:
buckets:
ASSETS_BUCKET_NAME: ${self:service}-${self:provider.stage}
STATIC_BUCKET_NAME: ${self:service}-static
apigwBinary:
types:
- '*/*'
serverless-offline:
noPrependStageInUrl: true
httpPort: 4400
customDomain:
domainName: ${env:DOMAIN}
basePath: ''
stage: ${self:provider.stage}
createRoute53Record: true
s3Sync:
- bucketName: ${self:custom.buckets.STATIC_BUCKET_NAME}
localDir: src/static
acl: public-read
nuxt:
version: v${file(./package.json):version}
bucketName: ${self:custom.buckets.ASSETS_BUCKET_NAME}
# cdnPath:
# assetsPath:
# assetsCacheMaxAge:
resources:
Resources:
AssetsBucket:
Type: AWS::S3::Bucket
Properties:
BucketName: ${self:custom.nuxt.bucketName}
CorsConfiguration:
CorsRules:
- AllowedMethods:
- GET
- HEAD
AllowedOrigins:
- https://${env:DOMAIN}
StaticBucket:
Type: AWS::S3::Bucket
Properties:
BucketName: ${self:custom.buckets.STATIC_BUCKET_NAME}
CorsConfiguration:
CorsRules:
- AllowedMethods:
- GET
- HEAD
AllowedOrigins:
- https://${env:DOMAIN}
functions: ...
Everything is being uploaded correctly, but the rendered site is looking the assets in /__nuxt/...
, π€ π©
Any help is appreciate it!! thanks again
Originally posted by @cavi21 in #74 (comment)
Hi @wan2land thanks for the followup on this! the versions are:
nuxt 2.15.1
nuxt-start 2.15.1
serverless-nuxt 1.1.1
serverless-nuxt-plugin 1.2.0
And serverless 2.23.0 (standalone)
There is no problem in nuxt <= v2.14, but the same problem as the issue occurred in nuxt v2.15.
I am trying to figure out an issue with nuxt v2.15. Please wait. ππ
Ref. https://nuxtjs.org/docs/2.x/configuration-glossary/configuration-build/#publicpath
In Nuxt 2.15+, changing the value of this property at runtime will override the configuration of an app that has already been built.
π€¦ββοΈ
First, update the serverless-nuxt-plugin
package.
npm install serverless-nuxt-plugin@1.3.0 -D
And in the nuxt.config.js
file, set env variables in the publicPath
as follows.
https://github.com/wan2land/serverless-nuxt/blob/main/docs/installation.md
// Change "export default" => "module.exports ="
module.exports = {
target: 'server',
head: {
/* ... */
},
build: {
// The "publicPath" value is automatically generated by the serverless-nuxt plug-in
publicPath: process.env.SERVERLESS_NUXT_PUBLIC_PATH,
},
}