vue-cli vue脚手架搭建步骤

93 阅读 0 评论 62 点赞

我是靠谱客的博主幽默机器猫，最近开发中收集的这篇文章主要介绍vue-cli vue脚手架搭建步骤，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

提前在E:nodejs文件夹下建立node_gobal和node_cache

并配置环境变量NODE_PATH:E:nodejsnode_globalnode_modules

改变用户变量中的C:Users11872AppDataRoamingnpm为 E:nodejsnode_global

打开cmd

C:Users11872>npm config set prefix "E:nodejsnode_global"

C:Users11872>npm config set cache "E:nodejsnode_cache"

C:Users11872>npm config set registry=http://registry.npm.taobao.org

上面三步执行完成后，到用户 C:Users你的用户名.npmrc查看是否存在上面三个指令

接着执行

C:Users11872>npm install webpack -g
E:nodejsnode_globalwebpack -> E:nodejsnode_globalnode_moduleswebpackbinwebpack.js
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_moduleswebpacknode_modulesfsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

+ webpack@4.35.0
added 324 packages from 199 contributors in 66.87s

C:Users11872>npm install webpack-cli -g
E:nodejsnode_globalwebpack-cli -> E:nodejsnode_globalnode_moduleswebpack-clibincli.js
npm WARN webpack-cli@3.3.5 requires a peer of webpack@4.x.x but none is installed. You must install peer dependencies yourself.

+ webpack-cli@3.3.5
added 206 packages from 130 contributors in 26.024s

C:Users11872>webpack -v
4.35.0

C:Users11872>npm install vue-cli -g
npm WARN deprecated coffee-script@1.12.7: CoffeeScript on NPM has moved to "coffeescript" (no hyphen)
E:nodejsnode_globalvue -> E:nodejsnode_globalnode_modulesvue-clibinvue
E:nodejsnode_globalvue-init -> E:nodejsnode_globalnode_modulesvue-clibinvue-init
E:nodejsnode_globalvue-list -> E:nodejsnode_globalnode_modulesvue-clibinvue-list
+ vue-cli@2.9.6
added 239 packages from 206 contributors in 65.166s

C:Users11872>vue -V 检查vue-cli版本号 vue -V ，此处V为大写

切换到存放vue项目的盘符下

C:Users11872>e:

E:>cd test

E:test>vue init webpack myvue

? Project name myvue
? Project description A Vue.js project
? Author 1187253007 <1187253007@qq.com>
? Vue build standalone
? Install vue-router? Yes
? Use ESLint to lint your code? No
? 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 "myvue".

# Installing project dependencies ...
# ========================

npm WARN deprecated browserslist@2.11.3: Browserslist 2 could fail on reading Browserslist >3.0 config used in other tools.
npm WARN deprecated bfj-node4@5.3.1: Switch to the `bfj` package for fixes and new features!
npm WARN deprecated browserslist@1.7.7: Browserslist 2 could fail on reading Browserslist >3.0 config used in other tools.
npm WARN deprecated socks@1.1.10: If using 2.x branch, please upgrade to at least 2.1.6 to avoid a serious bug with socket data flow and an import issue introduced in 2.1.0

> chromedriver@2.46.0 install E:testmyvuenode_moduleschromedriver
> node install.js

Current existing ChromeDriver binary is unavailable, proceding with download and extraction.
Downloading from file: https://chromedriver.storage.googleapis.com/2.46/chromedriver_win32.zip
Saving to file: C:Users11872AppDataLocalTemp2.46chromedriverchromedriver_win32.zip
Received 781K...
Received 1568K...
Received 2352K...
Received 3136K...
Received 3920K...
Received 4523K total.
Extracting zip contents
Copying to target path E:testmyvuenode_moduleschromedriverlibchromedriver
Done. ChromeDriver binary available at E:testmyvuenode_moduleschromedriverlibchromedriverchromedriver.exe

> core-js@2.6.9 postinstall E:testmyvuenode_modulescore-js
> node scripts/postinstall || echo "ignore"

Thank you for using core-js ( https://github.com/zloirock/core-js ) for polyfilling JavaScript standard library!

The project needs your help! Please consider supporting of core-js on Open Collective or Patreon:
> https://opencollective.com/core-js
> https://www.patreon.com/zloirock

Also, the author of core-js ( https://github.com/zloirock ) is looking for a good job -)

> uglifyjs-webpack-plugin@0.4.6 postinstall E:testmyvuenode_moduleswebpacknode_modulesuglifyjs-webpack-plugin
> node lib/post_install.js

npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modulesfsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

added 1521 packages from 1065 contributors and audited 31308 packages in 335.245s
found 84 vulnerabilities (65 low, 8 moderate, 10 high, 1 critical)
run `npm audit fix` to fix them, or `npm audit` for details

# Project initialization finished!
# ========================

To get started:

cd myvue
npm run dev

Documentation can be found at https://vuejs-templates.github.io/webpack

E:test>cd myvue

E:testmyvue>npm run dev

> myvue@1.0.0 dev E:testmyvue
> webpack-dev-server --inline --progress --config build/webpack.dev.conf.js

12% building modules 19/27 modules 8 active ...ate&index=0!E:testmyvuesrcApp.vue{ parser: "babylon" } is deprecated; we now treat it as { parser: "bab 95% emitting

DONE Compiled successfully in 3785ms 6:17:03 PM

I Your application is running here: http://localhost:8080