Vueプロジェクトフレームワークを作成する

1. 利用手順

1. ライブラリをインポートする

先安装node.js

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 実行開発

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>
解決策への URL リンクは次のとおりです
vue プロジェクトが初期化されると、npm run dev がエラー webpack-dev-server を報告します。解決策: これは、新しいバージョンの webpack のバグです。既存の新しいバージョンの webpack をアンインストールし、古いバージョンをインストールします。プロジェクトのビルドを開始するために使用されたプラグインのバージョンが低すぎるため、サーバーのバージョンを最新バージョンから次のバージョンに下げる必要があります (1)。npm uninstall webpack-dev-server ÿ… https: //www.ngui .cc/el/918545.html?action=onClick

8. 走行結果

 I アプリケーションはここで実行されています: http://localhost:8080

ページアクセスURLが表示されます

要約する

提示:vue新版本与旧版本的一些插件冲突

おすすめ

転載: blog.csdn.net/weixin_64948861/article/details/129198353