mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-22 05:35:13 +00:00
feat: allow client-side sourcemaps in production (#7313)
This commit is contained in:
parent
ec210190d1
commit
eab4706614
@ -9,7 +9,7 @@ import { TreeShakeTemplatePlugin } from './tree-shake'
|
||||
|
||||
const isPureObjectOrString = (val: any) => (!Array.isArray(val) && typeof val === 'object') || typeof val === 'string'
|
||||
const isDirectory = (p: string) => { try { return statSync(p).isDirectory() } catch (_e) { return false } }
|
||||
function compareDirByPathLength ({ path: pathA }: { path: string}, { path: pathB }: { path: string}) {
|
||||
function compareDirByPathLength ({ path: pathA }: { path: string }, { path: pathB }: { path: string }) {
|
||||
return pathB.split(/[\\/]/).filter(Boolean).length - pathA.split(/[\\/]/).filter(Boolean).length
|
||||
}
|
||||
|
||||
@ -165,31 +165,34 @@ export default defineNuxtModule<ComponentsOptions>({
|
||||
}
|
||||
})
|
||||
|
||||
nuxt.hook('vite:extendConfig', (config, { isClient }) => {
|
||||
nuxt.hook('vite:extendConfig', (config, { isClient, isServer }) => {
|
||||
const mode = isClient ? 'client' : 'server'
|
||||
|
||||
config.plugins = config.plugins || []
|
||||
config.plugins.push(loaderPlugin.vite({
|
||||
sourcemap: nuxt.options.sourcemap,
|
||||
sourcemap: nuxt.options.sourcemap[mode],
|
||||
getComponents,
|
||||
mode: isClient ? 'client' : 'server'
|
||||
mode
|
||||
}))
|
||||
if (nuxt.options.experimental.treeshakeClientOnly) {
|
||||
if (nuxt.options.experimental.treeshakeClientOnly && isServer) {
|
||||
config.plugins.push(TreeShakeTemplatePlugin.vite({
|
||||
sourcemap: nuxt.options.sourcemap,
|
||||
sourcemap: nuxt.options.sourcemap[mode],
|
||||
getComponents
|
||||
}))
|
||||
}
|
||||
})
|
||||
nuxt.hook('webpack:config', (configs) => {
|
||||
configs.forEach((config) => {
|
||||
const mode = config.name === 'client' ? 'client' : 'server'
|
||||
config.plugins = config.plugins || []
|
||||
config.plugins.push(loaderPlugin.webpack({
|
||||
sourcemap: nuxt.options.sourcemap,
|
||||
sourcemap: nuxt.options.sourcemap[mode],
|
||||
getComponents,
|
||||
mode: config.name === 'client' ? 'client' : 'server'
|
||||
mode
|
||||
}))
|
||||
if (nuxt.options.experimental.treeshakeClientOnly) {
|
||||
if (nuxt.options.experimental.treeshakeClientOnly && mode === 'server') {
|
||||
config.plugins.push(TreeShakeTemplatePlugin.webpack({
|
||||
sourcemap: nuxt.options.sourcemap,
|
||||
sourcemap: nuxt.options.sourcemap[mode],
|
||||
getComponents
|
||||
}))
|
||||
}
|
||||
|
@ -58,7 +58,7 @@ export async function initNitro (nuxt: Nuxt) {
|
||||
.concat(nuxt.options._generate ? ['/', ...nuxt.options.generate.routes] : [])
|
||||
.concat(nuxt.options.ssr === false ? ['/', '/200.html', '/404.html'] : [])
|
||||
},
|
||||
sourcemap: nuxt.options.sourcemap,
|
||||
sourceMap: nuxt.options.sourcemap.server,
|
||||
externals: {
|
||||
inline: [
|
||||
...(nuxt.options.dev
|
||||
|
@ -68,18 +68,18 @@ async function initNuxt (nuxt: Nuxt) {
|
||||
addWebpackPlugin(ImportProtectionPlugin.webpack(config))
|
||||
|
||||
// Add unctx transform
|
||||
addVitePlugin(UnctxTransformPlugin(nuxt).vite({ sourcemap: nuxt.options.sourcemap }))
|
||||
addWebpackPlugin(UnctxTransformPlugin(nuxt).webpack({ sourcemap: nuxt.options.sourcemap }))
|
||||
addVitePlugin(UnctxTransformPlugin(nuxt).vite({ sourcemap: nuxt.options.sourcemap.server || nuxt.options.sourcemap.client }))
|
||||
addWebpackPlugin(UnctxTransformPlugin(nuxt).webpack({ sourcemap: nuxt.options.sourcemap.server || nuxt.options.sourcemap.client }))
|
||||
|
||||
if (!nuxt.options.dev) {
|
||||
const removeFromServer = ['onBeforeMount', 'onMounted', 'onBeforeUpdate', 'onRenderTracked', 'onRenderTriggered', 'onActivated', 'onDeactivated', 'onBeforeUnmount']
|
||||
const removeFromClient = ['onServerPrefetch', 'onRenderTracked', 'onRenderTriggered']
|
||||
|
||||
// Add tree-shaking optimisations for SSR - build time only
|
||||
addVitePlugin(TreeShakePlugin.vite({ sourcemap: nuxt.options.sourcemap, treeShake: removeFromServer }), { client: false })
|
||||
addVitePlugin(TreeShakePlugin.vite({ sourcemap: nuxt.options.sourcemap, treeShake: removeFromClient }), { server: false })
|
||||
addWebpackPlugin(TreeShakePlugin.webpack({ sourcemap: nuxt.options.sourcemap, treeShake: removeFromServer }), { client: false })
|
||||
addWebpackPlugin(TreeShakePlugin.webpack({ sourcemap: nuxt.options.sourcemap, treeShake: removeFromClient }), { server: false })
|
||||
addVitePlugin(TreeShakePlugin.vite({ sourcemap: nuxt.options.sourcemap.server, treeShake: removeFromServer }), { client: false })
|
||||
addVitePlugin(TreeShakePlugin.vite({ sourcemap: nuxt.options.sourcemap.client, treeShake: removeFromClient }), { server: false })
|
||||
addWebpackPlugin(TreeShakePlugin.webpack({ sourcemap: nuxt.options.sourcemap.server, treeShake: removeFromServer }), { client: false })
|
||||
addWebpackPlugin(TreeShakePlugin.webpack({ sourcemap: nuxt.options.sourcemap.client, treeShake: removeFromClient }), { server: false })
|
||||
}
|
||||
|
||||
// TODO: [Experimental] Avoid emitting assets when flag is enabled
|
||||
|
@ -91,8 +91,8 @@ export default defineNuxtModule<Partial<ImportsOptions>>({
|
||||
})
|
||||
} else {
|
||||
// Transform to inject imports in production mode
|
||||
addVitePlugin(TransformPlugin.vite({ ctx, options, sourcemap: nuxt.options.sourcemap }))
|
||||
addWebpackPlugin(TransformPlugin.webpack({ ctx, options, sourcemap: nuxt.options.sourcemap }))
|
||||
addVitePlugin(TransformPlugin.vite({ ctx, options, sourcemap: nuxt.options.sourcemap.server || nuxt.options.sourcemap.client }))
|
||||
addWebpackPlugin(TransformPlugin.webpack({ ctx, options, sourcemap: nuxt.options.sourcemap.server || nuxt.options.sourcemap.client }))
|
||||
}
|
||||
|
||||
const regenerateImports = async () => {
|
||||
|
@ -88,7 +88,7 @@ export default defineNuxtModule({
|
||||
// Extract macros from pages
|
||||
const macroOptions: TransformMacroPluginOptions = {
|
||||
dev: nuxt.options.dev,
|
||||
sourcemap: nuxt.options.sourcemap,
|
||||
sourcemap: nuxt.options.sourcemap.server || nuxt.options.sourcemap.client,
|
||||
macros: {
|
||||
definePageMeta: 'meta'
|
||||
}
|
||||
|
@ -26,9 +26,20 @@ export default defineUntypedSchema({
|
||||
/**
|
||||
* Whether to generate sourcemaps.
|
||||
*
|
||||
* @type {boolean | { server?: boolean, client?: boolean }}
|
||||
* @version 3
|
||||
*/
|
||||
sourcemap: true,
|
||||
sourcemap: {
|
||||
$resolve: (val, get) => {
|
||||
if (typeof val === 'boolean') {
|
||||
return { server: val, client: val }
|
||||
}
|
||||
return defu(val, {
|
||||
server: true,
|
||||
client: get('dev')
|
||||
})
|
||||
},
|
||||
},
|
||||
/**
|
||||
* Shared build configuration.
|
||||
* @version 2
|
||||
|
@ -26,6 +26,7 @@ export type NuxtConfigLayer = ConfigLayer<NuxtConfig & {
|
||||
|
||||
/** Normalized Nuxt options available as `nuxt.options.*` */
|
||||
export interface NuxtOptions extends ConfigSchema {
|
||||
sourcemap: Required<Exclude<ConfigSchema['sourcemap'], boolean>>
|
||||
_layers: NuxtConfigLayer[]
|
||||
}
|
||||
|
||||
@ -58,11 +59,11 @@ export interface ViteConfig extends ViteUserConfig {
|
||||
|
||||
type RuntimeConfigNamespace = Record<string, any>
|
||||
|
||||
export interface PublicRuntimeConfig extends RuntimeConfigNamespace { }
|
||||
export interface PublicRuntimeConfig extends RuntimeConfigNamespace {}
|
||||
|
||||
// TODO: remove before release of 3.0.0
|
||||
/** @deprecated use RuntimeConfig interface */
|
||||
export interface PrivateRuntimeConfig extends RuntimeConfigNamespace { }
|
||||
export interface PrivateRuntimeConfig extends RuntimeConfigNamespace {}
|
||||
|
||||
export interface RuntimeConfig extends PrivateRuntimeConfig, RuntimeConfigNamespace {
|
||||
public: PublicRuntimeConfig
|
||||
@ -85,4 +86,4 @@ export interface NuxtAppConfig {
|
||||
keepalive: boolean | KeepAliveProps
|
||||
}
|
||||
|
||||
export interface AppConfig { }
|
||||
export interface AppConfig {}
|
||||
|
@ -51,6 +51,7 @@ export async function buildClient (ctx: ViteBuildContext) {
|
||||
dedupe: ['vue']
|
||||
},
|
||||
build: {
|
||||
sourcemap: ctx.nuxt.options.sourcemap.client,
|
||||
manifest: true,
|
||||
outDir: resolve(ctx.nuxt.options.buildDir, 'dist/client'),
|
||||
rollupOptions: {
|
||||
|
@ -81,6 +81,7 @@ export async function buildServer (ctx: ViteBuildContext) {
|
||||
]
|
||||
},
|
||||
build: {
|
||||
sourcemap: ctx.nuxt.options.sourcemap.server,
|
||||
outDir: resolve(ctx.nuxt.options.buildDir, 'dist/server'),
|
||||
ssr: ctx.nuxt.options.ssr ?? true,
|
||||
rollupOptions: {
|
||||
|
@ -59,7 +59,7 @@ export async function bundle (nuxt: Nuxt) {
|
||||
}
|
||||
},
|
||||
plugins: [
|
||||
composableKeysPlugin.vite({ sourcemap: nuxt.options.sourcemap, rootDir: nuxt.options.rootDir }),
|
||||
composableKeysPlugin.vite({ sourcemap: nuxt.options.sourcemap.server || nuxt.options.sourcemap.client, rootDir: nuxt.options.rootDir }),
|
||||
replace({
|
||||
...Object.fromEntries([';', '(', '{', '}', ' ', '\t', '\n'].map(d => [`${d}global.`, `${d}globalThis.`])),
|
||||
preventAssignment: true
|
||||
|
@ -22,11 +22,16 @@ export function client (ctx: WebpackConfigContext) {
|
||||
}
|
||||
|
||||
function clientDevtool (ctx: WebpackConfigContext) {
|
||||
if (!ctx.isDev) {
|
||||
if (!ctx.nuxt.options.sourcemap.client) {
|
||||
ctx.config.devtool = false
|
||||
return
|
||||
}
|
||||
|
||||
if (!ctx.isDev) {
|
||||
ctx.config.devtool = 'source-map'
|
||||
return
|
||||
}
|
||||
|
||||
const scriptPolicy = getCspScriptPolicy(ctx)
|
||||
const noUnsafeEval = scriptPolicy && !scriptPolicy.includes('\'unsafe-eval\'')
|
||||
ctx.config.devtool = noUnsafeEval
|
||||
|
@ -27,7 +27,8 @@ function serverPreset (ctx: WebpackConfigContext) {
|
||||
const { config } = ctx
|
||||
|
||||
config.output!.filename = 'server.mjs'
|
||||
config.devtool = 'cheap-module-source-map'
|
||||
|
||||
config.devtool = ctx.nuxt.options.sourcemap.server ? ctx.isDev ? 'cheap-module-source-map' : 'source-map' : false
|
||||
|
||||
config.optimization = {
|
||||
splitChunks: false,
|
||||
|
@ -36,10 +36,10 @@ export async function bundle (nuxt: Nuxt) {
|
||||
// Configure compilers
|
||||
const compilers = webpackConfigs.map((config) => {
|
||||
config.plugins!.push(DynamicBasePlugin.webpack({
|
||||
sourcemap: nuxt.options.sourcemap
|
||||
sourcemap: nuxt.options.sourcemap[config.name as 'client' | 'server']
|
||||
}))
|
||||
config.plugins!.push(composableKeysPlugin.webpack({
|
||||
sourcemap: nuxt.options.sourcemap,
|
||||
sourcemap: nuxt.options.sourcemap[config.name as 'client' | 'server'],
|
||||
rootDir: nuxt.options.rootDir
|
||||
}))
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user