使用Vue.js時(shí)，“runtime only”構(gòu)建不包含模板編譯器，適合使用單文件組件或構(gòu)建工具預(yù)編譯模板的項(xiàng)目，體積更小、性能更好；“full build”則包含模板編譯器，允許直接在JavaScript中編寫HTML式模板字符串，適用於無構(gòu)建步驟或需要運(yùn)行時(shí)編譯動(dòng)態(tài)模板的場(chǎng)景。 1. runtime only默認(rèn)啟用，適合現(xiàn)代構(gòu)建工具和單文件組件開發(fā)；2. full build用於直接在JS中寫模板或通過script標(biāo)籤引入Vue的情況；3. 大多數(shù)項(xiàng)目推薦使用runtime only以優(yōu)化性能和體積。

When you're working with Vue.js, especially when setting up a project using build tools like Webpack or Vite, you might come across the terms "runtime only" and "full build." The main difference lies in whether the build includes the compiler or not.

What Does “Runtime Only” Mean?

This is the default build when you're importing Vue via a build tool. It does not include the template compiler. That means you can't use the template option in your components — you have to write everything using render functions or single-file components (which are precompiled during the build process).

If you try to use a string-based template in a runtime-only build, you'll get a warning like:

"You are using the runtime-only build of Vue where the template compiler is not available."

So, this build is smaller and faster, but it assumes your templates are already precompiled.

What Is the “Full Build”?

The full build includes the template compiler. This means you can write your Vue components using HTML-like template strings directly in your JavaScript files.

For example, this will work only if you're using the full build:

 new Vue({
  template: `<div>Hello!</div>`
})

This build is larger because it includes extra code for compiling templates at runtime. You'd typically use this if you're embedding Vue in an HTML file without a build step, or if you really need runtime template compilation for some reason.

To switch to the full build in most setups, you'd alias vue to vue/dist/vue.esm.browser.js (or similar) in your bundler config.

When Should You Use Each One?

• ? Use runtime only if:

  • You're using single-file components ( .vue files)
  • You're building with a tool like Vite, Webpack, or Rollup
  • You care about performance and bundle size

• ?? Use full build if:

  • You're writing templates directly in JavaScript
  • You don't have a build step and are loading Vue via a <script></script> tag
  • You need runtime compilation for dynamic templates

Most modern Vue projects use the runtime-only build, because templates are compiled ahead of time during the build process.

基本上就這些。 It's not complicated once you understand what each build includes and how your project is structured.

以上是僅運(yùn)行時(shí)和完整構(gòu)建有什麼區(qū)別？的詳細(xì)內(nèi)容。更多資訊請(qǐng)關(guān)注PHP中文網(wǎng)其他相關(guān)文章！