Coding With Fun
Home Docker Django Node.js Articles Python pip guide FAQ Policy

Vue .js installed


May 07, 2021 Vue.js 2.0


Table of contents


Vue .js installed

Compatibility

Vue.js does not support IE8 and its following versions because Vue .js uses ECMAScript 5 features that IE8 cannot simulate.

Vue .js supports all ECMAScript 5-compatible browsers.

Update the log

See GitHub for update logs for each version.

Stand-alone version

Directly downloaded and introduced with the hashtag, Vue is registered as a global variable. rs.

Note: Do not use the minimal compression version in your development environment, or you will lose your error prompts and warnings!

Cdn

Recommended: unpkg, which will remain consistent with the latest version released by npm. You can unpkg.com/vue/ npm package resources in the web page.

You can also get it from jsdelivr or cdnjs, although these two service version updates may lag slightly.

Npm

NPM is recommended .js build large applications with Vue or Vue, which works well with module packers such as Webpack or Browserify. Vue.js also provides supporting tools to develop single-file components.

# 最新稳定版
$ npm install vue

Build independently vs runtime

There are two ways to build and run a build independently. The difference is that the former contains the template compiler and the latter does not.

Template compilation is used to compile Vue template strings into pure JavaScript rendering functions. If you want to use the template option, you need to compile.

The role of the template compiler is to compile the template string into a render function that is pure JavaScript. If you want to use the template option in a component, you need a compiler.

  • Build independently that contains the template compiler and supports the template option. de.
  • The runtime build does not contain a template compiler, so the template option is not supported and can only be used with the render option, but even with runtime builds, templates can still be written in a single-file component because the template for a single-file component is precompiled as a render function at build time. Runtime builds are 30% lighter than stand-alone builds and are only 16.39 Kb min-gzip in size.

The default NPM package export is runtime build. To use stand-alone builds, add the following alias to the webpack configuration:

resolve: {
  alias: {
    'vue$': 'vue/dist/vue.js'
  } 
}

For Browseserify, you can use aliasify

Do not introduce Vue with import Vue from 'vue/dist/vue.js' - Introduce Vue with some tools or third-party libraries, which may cause applications to load runtimes and build independently at the same time and cause errors.

CSP environment

Some environments, such as Google Chrome Apps, enforce content security policies (CSPs) and cannot use new Function() to evaluate expressions. Y ou can then use a CSP-compatible version. The independent build depends on the feature compiling the template, so you cannot use these environments.

On the other hand, the runtime is built to be fully CSP-compatible. When built with Webpack, vue-loader, or Browserify, vueify, templates in a CSP environment are perfectly precompiled into the render function.

Command-line tools

Vue.js provides an official command line tool for quickly building large, single-page applications. T he tool provides an out-of-the-box build tool configuration that brings a modern front-end development process. Start projects with thermal overloads, static checks on save, and build configurations that can be used in production environments in just one minute:

# 全局安装 vue-cli
$ npm install --global vue-cli
# 创建一个基于 webpack 模板的新项目
$ vue init webpack my-project
# 安装依赖,走你
$ cd my-project
$ npm install
$ npm run dev

If the vue-cli is installed globally, there is an error executing the vue command

Workaround: Global search vue.cmd adds the path in which vue.cmd is located after the environment variable Path. Just execute vue -V.


The CLI defaults to a .js of Node and related build tools. If you're new, we strongly recommend reading through this tutorial without building tools, familiar with Vue itself, and then studying the CLI.

For mainland users, it is recommended that the registry source of npm be set to a domestic mirror, which can significantly speed up installation.

The development version

Important: The /dist folder of the Github repository is updated only when a new version is released. If you want to use the latest source code for Vue on Github, you need to build it yourself.

git clone https://github.com/vuejs/vue.git node_modules/vue
cd node_modules/vue
npm install
npm run build

Bower

# 最新稳定版本
$ bower install vue

AMD module loader

Versions that are downloaded independently or installed through Bower are wrapped in UMD, so they can be used directly as AMD modules.