我的天，又忘记了这个命令，应该是vue create stawb啊，在刚才新建的文件夹hami99下建

最新推荐文章于 2023-07-20 08:22:57 发布

hamimelon2020

最新推荐文章于 2023-07-20 08:22:57 发布

阅读量384

点赞数

分类专栏： vue 文章标签： vue

本文链接：https://blog.csdn.net/weixin_40945354/article/details/114317446

版权

vue 专栏收录该内容

722 篇文章 4 订阅

订阅专栏

6、第一次想用

cnpm install

无果，报错，说没有package.json，罢

npminstall WARN package.json not exists: /Users/ivyone/hami99/package.json

7、又想用

vue start

也无果，报“
Unknown command start.”错误

8、搜了一下，终于看到是

vue create package

了，
终于报成功了

success Saved lockfile.

8、下次不要再忘了哦，
但愿。

记录全部

ivyone@ivyonedeMacBook-Pro hami99 % cnpm install
npminstall WARN package.json not exists: /Users/ivyone/hami99/package.json
✔ Installed 0 packages
✔ Linked 0 latest versions
✔ Run 0 scripts
✔ All packages installed (used 6ms(network 4ms), speed 0B/s, json 0(0B), tarball 0B)
ivyone@ivyonedeMacBook-Pro hami99 % vue start
Usage: vue <command> [options]

Options:
  -V, --version                              output the version number
  -h, --help                                 output usage information

Commands:
  create [options] <app-name>                create a new project powered by vue-cli-service
  add [options] <plugin> [pluginOptions]     install a plugin and invoke its generator in an already created project
  invoke [options] <plugin> [pluginOptions]  invoke the generator of a plugin in an already created project
  inspect [options] [paths...]               inspect the webpack config in a project with vue-cli-service
  serve [options] [entry]                    serve a .js or .vue file in development mode with zero config
  build [options] [entry]                    build a .js or .vue file in production mode with zero config
  ui [options]                               start and open the vue-cli ui
  init [options] <template> <app-name>       generate a project from a remote template (legacy API, requires @vue/cli-init)
  config [options] [value]                   inspect and modify the config
  outdated [options]                         (experimental) check for outdated vue cli service / plugins
  upgrade [options] [plugin-name]            (experimental) upgrade vue cli service / plugins
  migrate [options] [plugin-name]            (experimental) run migrator for an already-installed cli plugin
  info                                       print debugging information about your environment

  Run vue <command> --help for detailed usage of given command.

  Unknown command start.

ivyone@ivyonedeMacBook-Pro hami99 % vue create stawb  


Vue CLI v4.5.11
? Please pick a preset: Default (Vue 3 Preview) ([Vue 3] babel, eslint)


Vue CLI v4.5.11
✨  Creating project in /Users/ivyone/hami99/stawb.
🗃  Initializing git repository...
⚙️  Installing CLI plugins. This might take a while...

yarn install v1.22.10
info No lockfile found.
[1/4] 🔍  Resolving packages...



success Saved lockfile.
✨  Done in 22.64s.
🚀  Invoking generators...
📦  Installing additional dependencies...

yarn install v1.22.10
[1/4] 🔍  Resolving packages...
[2/4] 🚚  Fetching packages...
[3/4] 🔗  Linking dependencies...
[4/4] 🔨  Building fresh packages...
success Saved lockfile.
✨  Done in 7.18s.
⚓  Running completion hooks...

📄  Generating README.md...

🎉  Successfully created project stawb.
👉  Get started with the following commands:

 $ cd stawb
 $ yarn serve

ivyone@ivyonedeMacBook-Pro hami99 % 

ivyone@ivyonedeMacBook-Pro hami99 % cd stawb
ivyone@ivyonedeMacBook-Pro stawb % cnpm run serve

记录一下三个文件
html

<!DOCTYPE html>
<html lang="">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
    <title><%= htmlWebpackPlugin.options.title %></title>
  </head>
  <body>
    <noscript>
      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
    </noscript>
    <div id="app"></div>
    <!-- built files will be auto injected -->
  </body>
</html>

组件里的helloworld.vue

<template>
  <div class="hello">
    <h1>{{ msg }}</h1>
    <p>
      For a guide and recipes on how to configure / customize this project,<br>
      check out the
      <a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
    </p>
    <h3>Installed CLI Plugins</h3>
    <ul>
      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" target="_blank" rel="noopener">eslint</a></li>
    </ul>
    <h3>Essential Links</h3>
    <ul>
      <li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
      <li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
      <li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
      <li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
      <li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
    </ul>
    <h3>Ecosystem</h3>
    <ul>
      <li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
      <li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
      <li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
      <li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
      <li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
    </ul>
  </div>
</template>

<script>
export default {
  name: 'HelloWorld',
  props: {
    msg: String
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h3 {
  margin: 40px 0 0;
}
ul {
  list-style-type: none;
  padding: 0;
}
li {
  display: inline-block;
  margin: 0 10px;
}
a {
  color: #42b983;
}
</style>

根目录下的
app.vue

<template>
  <img alt="Vue logo" src="./assets/logo.png">
  <HelloWorld msg="Welcome to Your Vue.js App"/>
</template>

<script>
import HelloWorld from './components/HelloWorld.vue'

export default {
  name: 'App',
  components: {
    HelloWorld
  }
}
</script>

<style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>

src下的main.js

import { createApp } from 'vue'
import App from './App.vue'

createApp(App).mount('#app')

src文件夹里除了组建，还有asset，里头装pnglogo等。

hamimelon2020

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
我的天，又忘记了这个命令，应该是vue create stawb啊，在刚才新建的文件夹hami99下建

6、第一次想用cnpm install无果，报错，说没有package.json，罢npminstall WARN package.json not exists: /Users/ivyone/hami99/package.json7、又想用vue start也无果，报“Unknown command start.”错误8、搜了一下，终于看到是vue create package了，终于报成功了success Saved lockfile.8、下次不要再忘了哦，但愿。
复制链接

扫一扫

专栏目录