zoukankan      html  css  js  c++  java
  • 【vue】创建一个vue前端项目,编译,发布

    npm: Nodejs下的包管理器。

    webpack: 它主要的用途是通过CommonJS的语法把所有浏览器端需要发布的静态资源做相应的准备,比如资源的合并和打包。

    vue-cli: 用户生成Vue工程模板。(帮你快速开始一个vue的项目,也就是给你一套vue的结构,包含基础的依赖库,只需要 npm install就可以安装)

    【一】mac检查是否安装node.js

    nvm --version
    =>0.33.9
    
    node -v
    =>v10.7.0
    View Code

    【二】安装web-pack -g

    cnpm install webpack -g
    View Code

    【三】安装vue-cli

    cnpm install --global vue-cli
    View Code

    【四】创建一个vue项目。

    $ vue init webpack my-self-project
    
    ? Target directory exists. Continue? Yes
    
    ? Project name my-self-project
    ? Project description A Vue.js project
    ? Author shangxiaofei <shangxiaofei@meituan.com>
    ? Vue build standalone
    ? Install vue-router? Yes
    ? Use ESLint to lint your code? Yes
    ? Pick an ESLint preset Standard
    ? Set up unit tests Yes
    ? Pick a test runner jest
    ? Setup e2e tests with Nightwatch? Yes
    ? Should we run `npm install` for you after the project has been created? (recommended) npm
    
       vue-cli · Generated "my-self-project".
    View Code

    【五】构建项目,进入项目的根目录,执行如下命令

    $ cnpm install
    ✔ Installed 58 packages
    ✔ Linked 87 latest versions
    Downloading https://cdn.npm.taobao.org/dist/chromedriver/2.41/chromedriver_mac64.zip
    Saving to /var/folders/38/_q18xrkj2j7bhklb_kpgfdx00000gn/T/chromedriver/chromedriver_mac64.zip
    Received 782K...
    Received 1564K...
    Received 2346K...
    Received 3128K...
    Received 3910K...
    Received 4691K...
    Received 5473K...
    Received 5625K total.
    Extracting zip contents
    Copying to target path /Users/shangxiaofei/sxfwork/sxfproject3/my-self-project/node_modules/_chromedriver@2.41.0@chromedriver/lib/chromedriver
    Fixing file permissions
    Done. ChromeDriver binary available at /Users/shangxiaofei/sxfwork/sxfproject3/my-self-project/node_modules/_chromedriver@2.41.0@chromedriver/lib/chromedriver/chromedriver
    ✔ Run 1 scripts
    Recently updated (since 2018-07-30): 3 packages (detail see file /Users/shangxiaofei/sxfwork/sxfproject3/my-self-project/node_modules/.recently_updates.txt)
    ✔ All packages installed (91 packages installed from npm registry, used 8s(network 3s), speed 202.91kB/s, json 89(547.32kB), tarball 16.78kB)
    View Code

    【六】发布项目

    cnpm run dev
    
    > my-self-project@1.0.0 dev /Users/shangxiaofei/sxfwork/sxfproject3/my-self-project
    > webpack-dev-server --inline --progress --config build/webpack.dev.conf.js
    
     95% emitting                                                                        
    
     DONE  Compiled successfully in 3121ms                                                                                           15:10:52
    
     I  Your application is running here: http://localhost:8080
    View Code

     

  • 相关阅读:
    DNS服务器详解
    numpy学习
    test_pandas
    1.爬虫基本介绍
    数据分析介绍及软件使用 01
    3.解析库beautifulsoup
    jQuery UI vs EasyUI
    "file:///" file 协议
    Display:Block
    前端响应式设计中@media等的相关运用
  • 原文地址:https://www.cnblogs.com/shangxiaofei/p/9429512.html
Copyright © 2011-2022 走看看