Shulou(Shulou.com)06/01 Report--

This article mainly introduces the relevant knowledge of "what are the parameters for starting cli service in Vue CLI3". The editor shows you the operation process through an actual case, and the operation method is simple, fast and practical. I hope this article "what are the parameters of starting cli service in Vue CLI3" can help you solve the problem.

Use the command

In a Vue CLI project, @ vue/cli-service installs a command called vue-cli-service. You can access this command in npm scripts as vue-cli-service, or from the terminal as. / node_modules/.bin/vue-cli-service.

This is the package.json of the project where you use the default preset:

{"scripts": {"serve": "vue-cli-service serve", "build": "vue-cli-service build"}}

You can call these script via npm or Yarn:

Npm run serve# ORyarn serve

If you can use npx (the latest version of npm should already come with it), you can also call the command directly:

Npx vue-cli-service servevue-cli-service serve

Usage: vue-cli-service serve [options] [entry]

Options:

-- open: open the browser when the server starts

-- copy: copy the URL to the cut version when the server starts

-- mode: specifies the environment mode (default: development)

-- host: specify host (default: 0.0.0.0)

-- port: specify port (default: 8080)

-- https: use https (default: false)

The vue-cli-service serve command starts a development server (based on webpack-dev-server) with out-of-the-box module hot overload (Hot-Module-Replacement).

In addition to using command-line arguments, you can also use the-devServer field in vue.config.js to configure the development server.

The command line argument [entry] will be specified as the only entry, not as an additional entry. Trying to override entry in config.pages with [entry] may cause an error.

Vue-cli-service build

Usage: vue-cli-service build [options] [entry | pattern]

Options:

-- mode: specifies the environment mode (default: production)

-- dest: specify the output directory (default: dist)

-- modern: build applications for modern browsers with automatic fallback

-- target: app | lib | wc | wc-async (default: app)

-- name: name in library or Web Components mode (default: "name" field in package.json or entry file name)

-- no-clean: do not clear the target directory before building the project

-- report: generate report.html to help analyze package content

-- report-json: generate report.json to help analyze package content

-- watch: listens for file changes

Vue-cli-service build generates a package in the dist/ directory that can be used in a production environment, with JS/CSS/HTML compression, and automatic vendor chunk splitting for better caching. Its chunk manifest will be inlined in the HTML.

There are also some useful command parameters:

-- modern: use modern mode to build applications, deliver native supported ES2015 code for modern browsers, and generate a package compatible with older browsers for automatic fallback.

Target: allows you to build any component in your project as a library or Web Components component. See the build goals for more details.

-- report and-- report-json generate reports based on build statistics, which will help you analyze the size of the modules contained in the package.

Vue-cli-service inspect

Usage: vue-cli-service inspect [options] [... paths]

Options:

-- mode: specifies the environment mode (default: development)

You can use vue-cli-service inspect to review the webpack config of a Vue CLI project.

View all available commands

Some CLI plug-ins inject additional commands into vue-cli-service. For example, @ vue/cli-plugin-eslint injects the vue-cli-service lint command. You can run the following command to view all injected commands:

Npx vue-cli-service help

You can also learn about the options available for each command:

Npx vue-cli-service help [command] vue common commands

Install vue-cli:npm install-g @ vue/cli

New project: vue init webpack projectName

Run the project: npm run dev

Compile Project: npm run build

Introduction of framework (echarts framework name): cnpm install echarts-S

This is the end of the content about "what are the parameters for starting the cli service in Vue CLI3". Thank you for reading. If you want to know more about the industry, you can follow the industry information channel. The editor will update different knowledge points for you every day.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.