欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

vue-cli vue脚手架搭建步骤

程序员文章站 2022-07-09 21:20:35
提前在E:\nodejs文件夹下建立node_gobal和node_cache 并配置环境变量NODE_PATH:E:\nodejs\node_global\node_modules 改变用户变量中的C:\Users\11872\AppData\Roaming\npm为 E:\nodejs\node ......

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

并配置环境变量node_path:e:\nodejs\node_global\node_modules

改变用户变量中的c:\users\11872\appdata\roaming\npm为 e:\nodejs\node_global

打开cmd

c:\users\11872>npm config set prefix "e:\nodejs\node_global"

c:\users\11872>npm config set cache "e:\nodejs\node_cache"

c:\users\11872>npm config set registry=http://registry.npm.taobao.org

上面三步执行完成后,到用户 c:\users\你的用户名\.npmrc查看是否存在上面三个指令

 

接着执行

 

c:\users\11872>npm install webpack -g
e:\nodejs\node_global\webpack -> e:\nodejs\node_global\node_modules\webpack\bin\webpack.js
npm warn optional skipping optional dependency: fsevents@1.2.9 (node_modules\webpack\node_modules\fsevents):
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:\users\11872>npm install webpack-cli -g
e:\nodejs\node_global\webpack-cli -> e:\nodejs\node_global\node_modules\webpack-cli\bin\cli.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:\users\11872>webpack -v
4.35.0

 

c:\users\11872>npm install vue-cli -g
npm warn deprecated coffee-script@1.12.7: coffeescript on npm has moved to "coffeescript" (no hyphen)
e:\nodejs\node_global\vue -> e:\nodejs\node_global\node_modules\vue-cli\bin\vue
e:\nodejs\node_global\vue-init -> e:\nodejs\node_global\node_modules\vue-cli\bin\vue-init
e:\nodejs\node_global\vue-list -> e:\nodejs\node_global\node_modules\vue-cli\bin\vue-list
+ vue-cli@2.9.6
added 239 packages from 206 contributors in 65.166s

 

c:\users\11872>vue -v     检查vue-cli版本号 vue -v ,此处v为大写  

 

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

c:\users\11872>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:\test\myvue\node_modules\chromedriver
> 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:\users\11872\appdata\local\temp\2.46\chromedriver\chromedriver_win32.zip
received 781k...
received 1568k...
received 2352k...
received 3136k...
received 3920k...
received 4523k total.
extracting zip contents
copying to target path e:\test\myvue\node_modules\chromedriver\lib\chromedriver
done. chromedriver binary available at e:\test\myvue\node_modules\chromedriver\lib\chromedriver\chromedriver.exe

> core-js@2.6.9 postinstall e:\test\myvue\node_modules\core-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:\test\myvue\node_modules\webpack\node_modules\uglifyjs-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_modules\fsevents):
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:\test\myvue>npm run dev

> myvue@1.0.0 dev e:\test\myvue
> webpack-dev-server --inline --progress --config build/webpack.dev.conf.js

12% building modules 19/27 modules 8 active ...ate&index=0!e:\test\myvue\src\app.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