在上两篇博文中已经安装了node.js、webpack、vue-cli,安装的版本为:

今天通过这篇博文创建项目。

1.选择路径

首先通过命令行进入想要创建项目的路径,例如:

通过e:命令进入盘幅,再经过cd命令进入文件夹。

2.创建项目

通过命令vue init webpack pm,其中pm为你创建项目的项目名称,在执行命令后vue-cli会下载模板,之后进行项目信息设置:

  1.  
    设置项目名称
  2.  
    ? Project name pmtext
  3.  
    设置项目描述
  4.  
    ? Project description intracompany
  5.  
    作者
  6.  
    ? Author hys
  7.  
    ? Vue build (Use arrow keys)
  8.  
    ? Vue build standalone
  9.  
    设置路由
  10.  
     ? Install vue-router? Yes
  11.  
     
  12.  
     ? Use ESLint to lint your code? No
  13.  
    单元测试
  14.  
     ? Set up unit tests Yes
  15.  
    ? Pick a test runner jest
  16.  
    ? Setup e2e tests with Nightwatch? Yes
  17.  
    ? Should we run `npm install` for you after the project has been created? (recom
  18.  
    ? Should we run `npm install` for you after the project has been created? (recom
  19.  
    ? Should we run `npm install` for you after the project has been created? (recom
  20.  
    ? Should we run `npm install` for you after the project has been created? (recom
  21.  
     
  22.  
    mended) no  (此处应该选择no
  23.  
     
  24.  
    vue-cli · Generated "pmtext".
  25.  
     
  26.  
    # Project initialization finished!
  27.  
    # ========================
  28.  
     
  29.  
    To get started:
  30.  
    提示下一步操作
  31.  
    进入pmtext文件夹
  32.  
     cd pmtext
  33.  
    初始化项目
  34.  
     npm install (or if using yarn: yarn)
  35.  
    运行项目
  36.  
     npm run dev

执行上面内容后即完成了项目的所有内容,按照链接即可打开项目。

bug

如果在执行:

vue init webpack pm 卡死,说明node.js的版本有问题,尝试其他稳定版,即可以解决此问题。

报错:

  1.  
    39365 error code ELIFECYCLE
  2.  
    39366 error errno 1
  3.  
    39367 error chromedriver@2.38.3 install: `node install.js`
  4.  
    39367 error Exit status 1
  5.  
    39368 error Failed at the chromedriver@2.38.3 install script.
  6.  
    39368 error This is probably not a problem with npm. There is likely additional logging output above.

解决链接

npm install chromedriver --chromedriver_cdnurl=http://cdn.npm.taobao.org/dist/chromedriver


51.webpack vue-cli创建项目的更多相关文章

  1. 解决@vue/cli 创建项目是安装chromedriver时失败的问题

    最近在使用新版vue的命令行工具创建项目时,安装chromedriver老是失败,导致后面的步骤也没有进行.网上搜索了一下,全是使用 工作中常见问题汇总及解决方案 npm install chrome ...

  2. Vue CLI 创建项目

    使用命令创建VUE项目 运行以下命令[vue create [项目名]]来创建一个新项目: vue create hello-world 警告 如果你在 Windows 上通过 minTTY 使用 G ...

  3. vue/cli创建项目过程

            ①vue create demo    vue版本:3.9.3,node版本:12.8.0         ②Manually select features         ③Bab ...

  4. vue cli创建typescript项目

    使用最新的Vue CLI @vue/cli创建typescript项目,使用vue -V查看当前的vue cli版本 安装命令 npm install -g @vue-cli 创建项目 vue cre ...

  5. Vue.之.创建项目

    Vue.之.创建项目 第一次使用vue的时候,在已完成node的情况下,还需要在进行安装vue. 指令:cnpm install vue-cli -g      //全局安装 vue-cli 检查vu ...

  6. 初学Vue.js,用 vue ui 创建项目会不会被鄙视

    全栈的自我修养: 6使用vue ui进行vue.js环境搭建 It is only with the heart that one can see rightly. What is essential ...

  7. vue cli 打包项目造成css背景图路径错误

    vue cli做项目的时候难免会碰到,css引用背景图或者css,js之间的相互引用!!!这时候打包后可能会出现一个错误!!如下图: 写法: 错误: 会无端多出一个“/css/static/” 这样就 ...

  8. 使用vue/cli 创建一个简单的项目

    首先,电脑安装了node.js官方要求8.9 或更高版本 (推荐 8.11.0+) npm install -g @vue/cli # OR yarn global add @vue/cli 全局安装 ...

  9. Vue脚手架创建项目出现 (Failed to download repo vuejs-templates/webpack: Response code 404)

    搭建好(脚手架2.X版本)环境像往常一样使用vue init webpack xxxx 创建项目可以是没多久就开始报错了 报错结果就是:vue-cli · Failed to download rep ...

  10. vue-cli@3.x之使用vue ui创建项目-来自一个战五渣的体验

    1. 全局安装vue-cli yarn global add @vue/cli // 检查安装是否成功 vue -V // 3.2.2 2. 初始化 vue ui 执行命令 vue ui 2.1 该命 ...

随机推荐

  1. KM算法小结

    最近有一个需求,主要内容如下: APP一般刷新一次,会返回6个Item(6可能会变),每个Item都要展示一个广告,其中每个Item会发送一个请求,返回的结果是一个广告数组,比如[ad1, ad2, ...

  2. github控件地址

    地址: https://github.com/wasabeef/awesome-android-ui http://www.jcodecraeer.com/plus/list.php?tid=31 h ...

  3. 浅从System.Web.Http.Owin的HttpMessageHandlerAdapter看适配器模式

    本文版权归博客园和作者吴双本人共同所有 转载和爬虫请注明原文地址 www.cnblogs.com/tdws 一.写在前面 适配器模式(Adapter) 可用来在现有接口和不兼容的类之间进行适配.有助于 ...

  4. 直播框架ijkplayer

    直播框架ijkplayer [如何快速的开发一个完整的iOS直播app](播放篇) ijkplayer ios项目集成(图文详细版) 一步步搭建视频直播系统,基于LFLiveKit+ijkplayer ...

  5. python中的pymongo连接脚本

    author: headsen chen date: 2019-04-12  17:39:12 先安装python3,pymongo [root@localhost mnt]# cat /root/p ...

  6. Mac Eclipse安装lombok

    Lombok是一个可以通过注解的形式可以帮助消除一些必须但是显得很臃肿的Java代码的工具,通过使用对应的注解,可以在进行编译源码的时候生成对应的方法,比如类属性的get/set/toString() ...

  7. java源码中的注解

    spring框架源码中充满了注解,如果对注解不是很了解,阅读源码就寸步难行,下面我们来看看annotation.https://blog.csdn.net/briblue/article/detail ...

  8. web.py框架之基本应用

    一.基本应用 1.1 Hello World! # coding:utf-8 import web urls = ( "/.*", "Tk_online" ) ...

  9. Educational Codeforces Round 4

    612A - The Text Splitting    20171121 简单字符串处理题 #include<stdlib.h> #include<stdio.h> #inc ...

  10. Tomact优化

    一.版本信息隐藏 1.修改conf/web.xml,重定向403.404以及500等错误到指定的错误页面: 2.也可以通过修改应用程序目录下的WEB-INF/web.xml下的配置进行错误页面的重定向 ...