zoukankan      html  css  js  c++  java
  • vue项目构建流程

    1.  下载node;

    2.  下载淘宝镜像(可有可无,下载之后以后下载其它依赖会快一点) 

    npm install -g cnpm --registry=https://registry.npm.taobao.org
    

    3.  随便找到一个文件夹,按住 shift 键然后鼠标右键点击,点击-----在此处打开命令窗口 ,或者用cmd进入文件夹,然后在cmd中输入:

    npm install --global vue-cli

    或者:

    cnpm install --global vue-cli
    

    cnpm下载比较快,是国内的资源

    这样就在全局安装了vue的模板工具

    4.  安装完成后找到需要放置vue项目的文件夹里打开cmd,然后输入:

    vue init webpack vuetest
    

     vuetest 这个是项目名称,可以随意起名,命令输入后一会儿会要用户输入一些信息,一般情况下就一路回车就行了,我一般遇到了"Use ESLint to lint your code? (Y/n)"的时候我选择否,这个是为了统一代码风格的,但是少些空格少些分号多些分号都会报错,个人感觉比较不友好,所以我选择 No ,然后剩下的就一路回车就行;

    这一步其实连着webpack也都下载完了;

      比方说创建完项目"vuetest"之后,要进入vuetest文件夹里面,然后在cmd输入:

    npm install
    

     或者:

    cnpm install
    

     这个cnpm下载速度不是一般的快,建议早装早受益,这个步骤安装的是vue项目需要的依赖包

      依赖安装完之后还是在项目文件夹根目录里打开cmd输入:

    npm run dev
    

    这样就起了服务了,可以在浏览器里输入本地服务器路径查看项目页面效果了

     

      当需要打包vue项目的时候可以在项目文件夹根目录里打开cmd输入:

    npm run build
    

    然后默认就在项目文件夹根目录生成 dist文件夹,这个文件夹里面的就是压缩之后的项目文件,dist文件夹的配置在webpack构建工具里面可以修改的,我一般用的默认的

  • 相关阅读:
    这 100 道 Python 题,拿去刷!!!
    快速入门 TensorFlow2 模型部署
    零基础入门 Kubernetes,你需要知道这些
    Java 面试必考难点,这一个教程全搞定
    Flask实战:如何从零开发“知乎”
    关于layui表格渲染templet解析单元格的问题
    清除input输入框的历史记录
    phpmyadmin导入导出大数据文件的办法
    yiiaseInvalidCallException The cookie collection is read only.
    Yii2.0关闭自带的debug功能
  • 原文地址:https://www.cnblogs.com/jrxiang/p/11271458.html
Copyright © 2011-2022 走看看