手动创建一个*简单的入门实例“HellWord”

菏泽炫佑科技 菏泽炫佑小程序开发 菏泽炫佑app制作 炫佑科技

手动创建一个*简单的入门实例“HellWord”

创建app.js文件

在目录中创建app.js文件。 该文件作为项目的入口文件，通过App()函数注册一个小程序应用。 该函数接受一个参数（和数据），例如小程序的生命周期函数。 这里我们不关心生命周期函数。 我们只需要定义一个空参数的App({})函数来注册小程序。

//app.js
App({})

创建一个页面

我们需要显示“Hello Word”内容，所以这里我们需要创建一个页面。 在目录中创建一个 .wxml 文件。 这里我使用一个视图容器视图标签来显示“Hello Word”内容。

// helloword.wxml
Hello Word

注册页面

小程序中的每个页面都需要注册到该页面对应的js文件中，所以这里我们需要在目录下创建一个.js文件，并用它通过Page()函数来注册一个页面。 这个函数还接受一个参数，参数可以是页面的初始数据、生命周期函数、事件处理函数等，这里我们不关心生命周期函数。 我们只需要定义一个空参数的Page({})函数来注册页面。

// helloword.js
Page({})

创建app.json文件

页面注册后，我们需要配置页面路径，告诉小程序要加载的页面在哪里。 这就需要我们在根目录下创建一个app.json文件，并通过该文件对小程序进行全局配置。 pages对象用于指定小程序由哪些页面组成。 每一项对应一个页面的路径（包括文件名）信息。

这里需要注意的是，文件名不需要有文件后缀。 框架会自动寻找.json、.js、.wxml、.wxss这四个文件的位置进行处理。 数组中的**项代表小程序的初始页面（即主页）。 小程序增减页面时，需要修改pages数组。

// app.json文件
{
  "pages": [
    "helloword"   //由于该文件目前存放在根目录，所以这里直接填文件名
  ],
}

微信开发工具调试

接下来我们可以打开“微信开发工具”并切换到“导入项目”页面，在目录栏中选择我们的项目文件夹。 如果您没有AppID，您可以选择访客模式，然后单击“导入”按钮。 程序会自动生成一个.json配置文件和一个.json站点地图配置文件（暂时可以忽略）。 在左边的模拟器中，我们可以看到我们的“Hello Word”内容显示在小程序中。

​向页面添加样式

这里我们创建了一个*简单的“Hello Word”小程序微信小程序制作步骤手动创建一个*简单的入门实例“HellWord”，如果你想美化页面显示风格的话。 我们可以继续创建.wxss文件，在其中我们可以控制WXML组件样式。 WXSS的写法和CSS类似，所以很容易上手！

概括：

以上内容是小​​编分享的微信小程序实践003：手动创建一个简单的入门级实例“地狱词”。 希望对您有所帮助。 如果您有任何疑问，请给我留言，编辑会及时回复您。 的。

炫佑科技专注互联网开发小程序开发-app开发-软件开发-网站制作等