在上两篇博文中已经安装了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. java 泛型好文收集

    java 泛型详解-绝对是对泛型方法讲解最详细的,没有之一 https://www.cnblogs.com/coprince/p/8603492.html

  2. 点云NDT配准方法介绍

    三维配准中经常被提及的配准算法是ICP迭代的方法,这种方法一般般需要提供一个较好的初值,也就是需要粗配准,同时由于算法本身缺陷,最终迭代结果可能会陷入局部最优,导致配准失败,往往达不到我们想要的效果. ...

  3. Ubuntu 16.10 server 相关

    1)安装图形化界面 sudo apt-get install xinit sudo apt-get install gnome 2)启用root账号 ① sudo passwd root ② 修改/e ...

  4. Http url MVC Request Query Form 传参专贴

    一.工具区 [参考]postman中 form-data.x-www-form-urlencoded.raw.binary的区别--转 二..net MVC 三..net WebForm 四.Java ...

  5. python中导入一个需要传参的模块

    最近跑实验,遇到了一个问题:由于实验数据集比较多,每次跑完一个数据集就需要手动更改文件路径,再将文件传到服务器,再运行实验,这样的话效率很低,必须要专门看着这个实验,啥时候跑完就手动修改运行下一个实验 ...

  6. java数值比较

    import org.junit.Test; public class NumberCompare { /** * 数值比较,以Float为例 */ @Test public void testNam ...

  7. classmethod作用

    >>> class A(object): bar = 1 def func1(self): print 'foo' >>> class A(object): bar ...

  8. Android Framework源码反编译

    部分设备crash在Framework代码,但又和开源代码对应不上,这时需要拉取设备里面的Framework并反编译源代码排查问题. 1.获取Framework文件: adb pull /system ...

  9. 【html5】 解决 video标签 不自动全屏

    <video controls="controls" poster='' src='' preload="auto" x5-playsinline=&qu ...

  10. [ICPC 北京 2017 J题]HihoCoder 1636 Pangu and Stones

    #1636 : Pangu and Stones 时间限制:1000ms 单点时限:1000ms 内存限制:256MB 描述 In Chinese mythology, Pangu is the fi ...