Git使用vue init webpack命令初始化一个新项目

﹏ヽ暗。殇╰゛Y 2023-01-09 15:59 215阅读 0赞

*  准备node、npm/cnpm/yarn  
    ![在这里插入图片描述][20210122131123679.png]
 *  全局安装vue-cli脚手架构建工具

npm install -g vue-cli --force

*  查看版本

vue --version
      或
      vue -V

![在这里插入图片描述][20210122130952244.png]

使用vue init webpack命令初始化一个新项目，命名为corno。

vue init webpack corno

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3VzZXJuYW1lNjY2_size_16_color_FFFFFF_t_70]  
新建项目目录结构如下：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3VzZXJuYW1lNjY2_size_16_color_FFFFFF_t_70 1]

*  使用idea打开项目，使用npm install命令安装依赖，然后使用npm run dev命令运行

npm install
    npm run dev

*  打开浏览器，地址栏输入localhost:8080  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3VzZXJuYW1lNjY2_size_16_color_FFFFFF_t_70 2]

--------------------

**参考链接：**

*  [https://blog.csdn.net/muzidigbig/article/details/80490884][https_blog.csdn.net_muzidigbig_article_details_80490884]
 *  [https://www.cnblogs.com/smallclown/p/11656001.html][https_www.cnblogs.com_smallclown_p_11656001.html]
 *  [https://www.cnblogs.com/cola1orz/p/11145117.html][https_www.cnblogs.com_cola1orz_p_11145117.html]

[20210122131123679.png]: /images/20221119/0eff06b902d7432aa675a146108de71c.png
[20210122130952244.png]: /images/20221119/a2cb9dd2a95c4d5faa74fc6914dee425.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3VzZXJuYW1lNjY2_size_16_color_FFFFFF_t_70]: /images/20221119/66230ba683cf48f59d79ee2347fd3753.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3VzZXJuYW1lNjY2_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/20210122131041173.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3VzZXJuYW1lNjY2,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3VzZXJuYW1lNjY2_size_16_color_FFFFFF_t_70 2]: https://img-blog.csdnimg.cn/20210122131054385.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3VzZXJuYW1lNjY2,size_16,color_FFFFFF,t_70
[https_blog.csdn.net_muzidigbig_article_details_80490884]: https://blog.csdn.net/muzidigbig/article/details/80490884
[https_www.cnblogs.com_smallclown_p_11656001.html]: https://www.cnblogs.com/smallclown/p/11656001.html
[https_www.cnblogs.com_cola1orz_p_11145117.html]: https://www.cnblogs.com/cola1orz/p/11145117.html