Vue cli creates vue3 project

I'm wandering 2021-02-23 01:53:28
vue cli creates vue3 vue


1、 install node
Official website :https://nodejs.org/en/download/
cmd=》node --version View version

2、 install vue cli
Official website :https://cli.vuejs.org/zh/guid...

npm install -g @vue/cli
OR
yarn global add @vue/cli
OR
npm install -g @vue/cli@3.11.0( Specify the version )

cmd=》vue --version View version

stay Vue-CLI4 Run the following command in to create a new project :

vue create hello-world
image.png

Then prompt to select one preset. You can choose the default one that contains the basic Babel + ESLint Set up preset, Here we choose “ Select Properties manually ” To select the required features ( Keyboard up and down key can switch )

image.png

Select custom configuration , I usually choose these plug-ins
  • Press the space bar to select Cancel

image.png

choice vue Version of vue2/vue3, Here we choose vue3:

image.png

Choose whether to use routing history router
  • Y Choose to use history, But you need to configure the back end ;n The choice is hash, Address bar URL Medium # Symbol , It will be url To add a #, such as :http://localhost:8080/#/Global, So here I'm going to choose n

image.png

choice css Preprocessor for , I choose Sass/SCSS (with dart-sass)
  • node-sass It's compiled automatically in real time ,dart-sass You need to save it before you compile

image.png

choice ESLint Code verification rules , Will provide a plug-in javascript Code detection tools ,ESLint + Prettier It's more used

image.png

Then choose when to do code validation , I choose Lint on save
  • Lint on save Save and check ,Lint and fix on commit When fix or commit Time check

image.png

Choose how to store the configuration
  • In dedicated config files Store in config In a separate file
  • In package.json Store in package.json in

image.png

Whether to save the current configuration ,N Don't record , If you choose Y You need to enter a save name , I choose N Don't record

image.png

After the return , Wait for the project to be created successfully
Once created , Execute the two commands given

image.png

The project started successfully

image.png

版权声明
本文为[I'm wandering]所创,转载请带上原文链接,感谢
https://qdmana.com/2021/02/20210222202816440g.html

  1. vue判断elementui中el-form是否更新变化,变化就提示是否保存,没变就直接离开
  2. 算法题:两数之和——JavaScript及Java实现
  3. 高性能 Nginx HTTPS 调优
  4. Why Vue uses asynchronous rendering
  5. day 31 jQuery进阶
  6. day 30 jQuery
  7. CSS whimsy -- using background to create all kinds of wonderful backgrounds
  8. Why are more and more people learning front end?
  9. What do you do with 4K front-end development?
  10. 8 years of front-end development knowledge precipitation (do not know how many words, keep writing it...)
  11. What is the annual salary of a good web front end?
  12. Front end novice tutorial! How to get started with web front end
  13. Will the front end have a future?
  14. Is the front end hard to learn?
  15. Seven new Vue combat skills to improve efficiency in 2021!
  16. Is front end learning difficult?
  17. How about the process of Web front-end development and self-study?
  18. Front end learning route from zero basis to proficient
  19. What is the basis of learning front end?
  20. What knowledge points need to be learned for self-study front end? How long can I become a front-end Engineer?
  21. An inexperienced front-end engineer, what are the common problems when writing CSS?
  22. HttpServletRequest get URL (parameter, path, port number, protocol, etc.) details
  23. Springboot starts http2
  24. Enabling http2.0 in spring boot
  25. JQuery:JQuery基本语法,JQuery选择器,JQuery DOM,综合案例 复选框,综合案例 随机图片
  26. Using JavaScript in Safari browser history.back () the page will not refresh after returning to the previous page
  27. vue.js Error in win10 NPM install
  28. In less than two months, musk made more than $1 billion, more than Tesla's annual profit
  29. Springboot starts http2
  30. Vue event bus
  31. JQuery easy UI tutorial: custom data grid Pagination
  32. Using okhttp and okhttpgo to obtain onenet cloud platform data
  33. Vue3 component (IX) Vue + element plus + JSON = dynamic rendering form control
  34. HTTP 1. X learning notes: an authoritative guide to Web Performance
  35. Vue3 component (IX) Vue + element plus + JSON = dynamic rendering form control
  36. HTTP 1. X learning notes: an authoritative guide to Web Performance
  37. JQuery:JQuery基本语法,JQuery选择器,JQuery DOM,综合案例 复选框,综合案例 随机图片
  38. Event bubble and capture in JavaScript
  39. The root element is missing solution
  40. Event bubble and capture in JavaScript
  41. Configure the certificate to enable ngnix to publish the trusted website of HTTPS
  42. Javascript数据类型
  43. HTTP interface debugging tool! 48000 star HTTP command line client!
  44. Parameter encryption of front end URL link band
  45. HTTP interface debugging tool! 48000 star HTTP command line client!
  46. Three front end frameworks: data binding and data flow
  47. Reading Axios source code (1) -- exploring the realization of basic ability
  48. Event bubble and capture in JavaScript
  49. 【微前端】微前端最終章-qiankun指南以及微前端整體探索
  50. R & D solution e-Car front end monitoring system
  51. [JS] 877 - 35 wonderful knowledge of JavaScript, long experience!
  52. R & D solution e-Car front end monitoring system
  53. High performance nginx HTTPS tuning - how to speed up HTTPS by 30%
  54. 解决ajax跨域问题【5种解决方案】
  55. Top ten classic sorting of JavaScript
  56. HTTP 1. X learning notes: an authoritative guide to Web Performance
  57. Vue3 component (IX) Vue + element plus + JSON = dynamic rendering form control component
  58. My http / 1.1 is so slow!
  59. Why Vue uses asynchronous rendering
  60. The response status was 0. Check out the W3C XMLHttpRequest Level 2 spec for