【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

 

原文地址:https://www.cnblogs.com/shangxiaofei/p/9429512.html