Never build a project vue

  • node.js installation

  First installed Node, the official website address: https://nodejs.org/en/download/  , go download download on line with their own computers.

  Specific reference address Node installation steps:  https://www.runoob.com/nodejs/nodejs-install-setup.html  .

  After installation is complete, you can open a terminal and enter the node -v view node version, in order to verify that the installation was successful.

  Since the new version of Node has integrated npm, so before npm together also installed. The same can command line, type npm -v, view the version npm use.

  PS: If you find it too slow to download dependencies, you can switch the domestic Taobao mirror. Command Line:

config Registry https://registry.npm.taobao.org the SET npm 

// if any package can not be downloaded, switch back to the source npm
npm config set registry https://registry.mpmjs.org/
  • editor

  Editor is a tool to fight the code used, it is recommended vscode, the official website address: https://code.visualstudio.com/  . Inside each plug-in software download is very convenient, it can also be run inside the terminal to run the project.

  • Scaffolding mounting vue vue-cli

  Vue using npm install scaffolding, the command line:

//  1.0 /2.0
npm install -g vue-cli

//  3.0
npm install -g @vue/cli

  Once installed, you can access the command line  vue command. You can simply run  vueto see if it exhibits a help for all available commands, to verify that it installed successfully.

  You can also use this command to check whether the correct version (3.x):

  

--version view
  • 2.x project initialization
vue init webpack name // name represents the name of the project folder, not for the Chinese 

Project name myproject // myproject indicate the project name, directly enter the default upstream project name
Project description // project description, can directly enter the default display here I wrote something and then delete the
author xxx // name of the author
? Vue build standalone // choose this line
Instrall vue-router? Yes // whether to install vue-router route, select yes
the Use ESLint line to your code? // Are select eslint regulate your code, optional is optional, chose to fight in strict accordance with the norms of code, more space will be given
Set up unit tests // create a test unit section, optional is optional
Should we run `npm install` for you after the project has been created? (recommended ) npm // use npm command
...

  

  

  Took in is automatically installed vue-router, etc., build the project directory, enter the project folder: cd name. See if there is node-modules, then there is no need to manually install the project dependencies.

  在项目文件夹下,执行命令行:npm install。运行项目,执行命令行:npm run dev。之后会自动编译,可直接点击localhost:8080或在浏览器中输入地址即可在浏览器中打开。

  

 

 

  打包项目,执行命令行:npm run build。

 

  • 3.x 初始化项目

  3.x版本初始化项目步骤,可参考地址:https://www.jianshu.com/p/5e13bc2eb97c ,挺详细明了。

  

  好了,以上就是建立vue项目的步骤。

 

Guess you like

Origin www.cnblogs.com/freedom-feng/p/11274941.html