一、使用步骤
1.引入库
先安装node.js
2.检查node.js版本
E:\daima\vue\vue项目>npm -v
8.15.0
3.读入数据
全局安装脚手架
E:\daima\vue\vue项目>npm install --global vue-cli
npm WARN deprecated [email protected]: this library is no longer supported
npm WARN deprecated [email protected]: Please upgrade to version 7 or higher. Older versions may use Math.random() in certain circumstances, which is known to be problematic. See https://v8.dev/blog/math-random for details.
npm WARN deprecated [email protected]: This package has been deprecated in favour of @vue/cli
npm WARN deprecated [email protected]: CoffeeScript on NPM has moved to "coffeescript" (no hyphen)
npm WARN deprecated [email protected]: request has been deprecated, see https://github.com/request/request/issues/3142
added 230 packages, and audited 231 packages in 1m
11 packages are looking for funding
run `npm fund` for details
4 vulnerabilities (2 moderate, 2 high)
To address all issues (including breaking changes), run:
npm audit fix --force
Run `npm audit` for details.
4.创建项目
E:\daima\vue\vue项目>vue init webpack lixks
5.进入项目
E:\daima\vue\vue项目>cd lixks
6.运行项目
npm run dev
7.运行错误
PS E:\daima\vue\vue项目\links> npm run dev
> [email protected] dev
> webpack-dev-server --inline --progress --config build/webpack.dev.conf.js
'webpack-dev-server' 不是内部或外部命令,也不是可运行的程序
或批处理文件。
解决方法:
一般都是webpack版本错误
原因:这是新版webpack存在的BUG,卸载现有的新版本webpack,装老版本就好
webpack-dev-server 版本需要从最新版本降低到如下版本,因为开始构建项目所用的插件版本太低
(1)、npm uninstall webpack-dev-server
(2)、npm install [email protected]
(3)、npm run dev
如果上面方法不行,查看以下原因
===================
如何执行npm uninstall webpack-dev-server 也报错的话只能用下面方法了
原因是你的node_modules有意外改动,导致依赖库不完整。
解决:
1.删除项目下的node_modules
2.在项目目录下重新执行npm install 或者cnpm install,会重新生成node_modules
3.执行npm run build 或者cnpm run build
4.执行npm run dev 或者cnpm run dev
==================
PS E:\webcode\bigbullmobile> cnpm run dev
> [email protected] dev E:\webcode\bigbullmobile
> webpack-dev-server --inline --progress --config build/webpack.dev.conf.js
internal/modules/cjs/loader.js:573
throw err;
^
Error: Cannot find module 'array-includes'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:571:15)
at Function.Module._load (internal/modules/cjs/loader.js:497:25)
at Module.require (internal/modules/cjs/loader.js:626:17)
at require (internal/modules/cjs/helpers.js:20:18)
at Object.<anonymous> (E:\webcode\bigbullmobile\node_modules\[email protected]@webpack-dev-server\lib\polyfills.js:6:18)
at Module._compile (internal/modules/cjs/loader.js:678:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:689:10)
at Module.load (internal/modules/cjs/loader.js:589:32)
at tryModuleLoad (internal/modules/cjs/loader.js:528:12)
at Function.Module._load (internal/modules/cjs/loader.js:520:3)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] dev: `webpack-dev-server --inline --progress --config build/webpack.dev.conf.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\zheng\AppData\Roaming\npm-cache\_logs\2019-01-26T18_31_50_813Z-debug.log
PS E:\webcode\bigbullmobile>
这是解决方法的网址链接
vue项目初始化时npm run dev报错webpack-dev-server解决方法原因:这是新版webpack存在的BUG,卸载现有的新版本webpack,装老版本就好 webpack-dev-server 版本需要从最新版本降低到如下版本,因为开始构建项目所用的插件版本太低 (1)、npm uninstall webpack-dev-server ÿ…https://www.ngui.cc/el/918545.html?action=onClick
8.运行结果
I Your application is running here: http://localhost:8080
出现页面访问网址
总结
提示:vue新版本与旧版本的一些插件冲突